@useinsider/guido 3.20.0-beta.e801a3b → 3.20.0
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/extensions/Blocks/Recommendation/controls/cardComposition/index.js +91 -103
- package/dist/extensions/Blocks/Recommendation/utils/captureStyleTemplates.js +70 -72
- package/dist/extensions/Blocks/Recommendation/utils/compositionKeys.js +60 -69
- package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts +0 -3
- package/dist/src/extensions/Blocks/Recommendation/utils/compositionKeys.d.ts +0 -4
- package/package.json +1 -1
|
@@ -1,42 +1,42 @@
|
|
|
1
1
|
var at = Object.defineProperty;
|
|
2
|
-
var ct = (
|
|
3
|
-
var
|
|
2
|
+
var ct = (h, p, t) => p in h ? at(h, p, { enumerable: !0, configurable: !0, writable: !0, value: t }) : h[p] = t;
|
|
3
|
+
var $ = (h, p, t) => ct(h, typeof p != "symbol" ? p + "" : p, t);
|
|
4
4
|
import { ACADEMY_LINKS as dt } from "../../../../../enums/academy.js";
|
|
5
|
-
import { UIElementType as
|
|
5
|
+
import { UIElementType as _, UEAttr as O, ModificationDescription as y } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
6
6
|
import { CommonControl as ut } from "../../../common-control.js";
|
|
7
|
-
import { ATTR_PRODUCT_IMAGE as q, ATTR_PRODUCT_NAME as mt, ATTR_PRODUCT_PRICE as
|
|
7
|
+
import { ATTR_PRODUCT_IMAGE as q, ATTR_PRODUCT_NAME as mt, ATTR_PRODUCT_PRICE as C, ATTR_PRODUCT_OLD_PRICE as L, ATTR_PRODUCT_OMNIBUS_PRICE as ht, ATTR_PRODUCT_OMNIBUS_DISCOUNT as pt, ATTR_PRODUCT_BUTTON as x, ATTR_RECOMMENDATION_TITLE as I, ATTR_DATA_CARD_COMPOSITION as K, ATTR_DATA_CUSTOM_ATTRIBUTES as W, ATTR_CUSTOM_PREFIX as v, SELECTOR_ATTRIBUTE_ROW as N, SELECTOR_TITLE_CELL as z, ATTR_DATA_VISIBILITY as D, ATTR_DATA_ATTRIBUTE_TYPE as E, CSS_CLASS_ATTRIBUTE_ROW as G, CSS_CLASS_SPACER as _t, BUILT_IN_DEFAULT_ATTRIBUTES as gt } from "../../constants/selectors.js";
|
|
8
8
|
import { DEFAULT_COMPOSITION as Y, DEFAULT_VISIBILITY as X } from "../../constants/defaultConfig.js";
|
|
9
|
-
import { RecommendationConfigService as
|
|
9
|
+
import { RecommendationConfigService as g } from "../../services/configService.js";
|
|
10
10
|
import { useRecommendationExtensionStore as ft } from "../../store/recommendation.js";
|
|
11
11
|
import { ATTRIBUTE_CELL_CLASS as bt, gridElementRenderer as yt, DEFAULT_CELL_PADDING as Tt, buildFillerCell as Ct } from "../../templates/grid/elementRenderer.js";
|
|
12
12
|
import { listElementRenderer as St } from "../../templates/list/elementRenderer.js";
|
|
13
13
|
import { buildTitleRows as At, DEFAULT_TITLE_PARAGRAPH as It, DEFAULT_TITLE_TEXT as $t } from "../../templates/titleRows.js";
|
|
14
14
|
import { resolveInlinePriceOrder as vt, toDisplayName as Nt, toDisplayableAttributeValue as Et, buildElementRenderer as J } from "../../templates/utils.js";
|
|
15
|
-
import { normalizeCompositionKeys as Rt, normalizeCustomAttrValues as Lt, compositionKeyToProductAttr as k,
|
|
15
|
+
import { normalizeCompositionKeys as Rt, normalizeCustomAttrValues as Lt, compositionKeyToProductAttr as k, resolveRowCompositionKey as Ot, filterToProductAttrValue as T, findAttributeRow as Dt, rewriteLegacyRowKeyHtml as Q, bareAttributeName as H, isDefaultProductAttr as Ht, productAttrToCompositionKey as M } from "../../utils/compositionKeys.js";
|
|
16
16
|
import { getTableDisplayValue as Pt } from "../../utils/tagName.js";
|
|
17
17
|
import { isPartnerManagedBlock as wt, regenerateProductRowsWithStyles as Bt, getMainContainerTbody as kt, getCurrentLayout as Mt } from "../main/utils.js";
|
|
18
18
|
const Ut = "ui-elements-recommendation-card-composition", U = ".product-card-wrapper > tbody", Z = ".product-info-cell > table > tbody", tt = {
|
|
19
19
|
ADD_ATTRIBUTE: "addAttribute"
|
|
20
|
-
},
|
|
20
|
+
}, f = 5, P = "reorderIcon_", qt = '<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 = [
|
|
21
21
|
{ key: q, label: "Product Image" },
|
|
22
22
|
{ key: mt, label: "Product Name" },
|
|
23
|
-
{ key:
|
|
24
|
-
{ key:
|
|
23
|
+
{ key: C, label: "Product Price" },
|
|
24
|
+
{ key: L, label: "Product Original Price" },
|
|
25
25
|
{ key: ht, label: "Omnibus Price" },
|
|
26
26
|
{ key: pt, label: "Omnibus Discount" },
|
|
27
|
-
{ key:
|
|
28
|
-
],
|
|
27
|
+
{ key: x, label: "Product Button" }
|
|
28
|
+
], R = { key: I, label: "Title" }, xt = new Set(m.map((h) => h.key)), A = "customAttr_", w = "deleteAttr_";
|
|
29
29
|
class se extends ut {
|
|
30
30
|
constructor() {
|
|
31
31
|
super(...arguments);
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
32
|
+
$(this, "store", ft());
|
|
33
|
+
$(this, "unsubscribeStore", null);
|
|
34
|
+
$(this, "eventController", null);
|
|
35
35
|
/**
|
|
36
36
|
* Guard flag: when true, onTemplateNodeUpdated skips _initializeComposition.
|
|
37
37
|
* Used during _onReorder to prevent multiple intermediate rebuilds.
|
|
38
38
|
*/
|
|
39
|
-
|
|
39
|
+
$(this, "reorderInProgress", !1);
|
|
40
40
|
}
|
|
41
41
|
getId() {
|
|
42
42
|
return Ut;
|
|
@@ -50,7 +50,7 @@ class se extends ut {
|
|
|
50
50
|
${this._GuToggle(`visibility_${d.key}`)}
|
|
51
51
|
</div>
|
|
52
52
|
`).join(""), e = Array.from(
|
|
53
|
-
{ length:
|
|
53
|
+
{ length: f },
|
|
54
54
|
(d, c) => `
|
|
55
55
|
<div data-custom-select-key="${A}${c}" style="display: none;">
|
|
56
56
|
${this._GuSelect({
|
|
@@ -62,34 +62,34 @@ class se extends ut {
|
|
|
62
62
|
})}
|
|
63
63
|
</div>
|
|
64
64
|
`
|
|
65
|
-
).join(""), r = m.length +
|
|
65
|
+
).join(""), r = m.length + f, i = Array.from(
|
|
66
66
|
{ length: r },
|
|
67
67
|
(d, c) => `
|
|
68
68
|
<div data-reorder-icon-key="${P}${c}" style="display: none;">
|
|
69
|
-
<${
|
|
69
|
+
<${_.BUTTON}
|
|
70
70
|
class="guido-drag-handle-btn flat-inline flat-white"
|
|
71
71
|
${O.BUTTON.name}="${P}${c}"
|
|
72
72
|
>
|
|
73
|
-
<${
|
|
73
|
+
<${_.ICON}
|
|
74
74
|
src="reorder"
|
|
75
75
|
class="icon-button"
|
|
76
|
-
></${
|
|
77
|
-
</${
|
|
76
|
+
></${_.ICON}>
|
|
77
|
+
</${_.BUTTON}>
|
|
78
78
|
</div>
|
|
79
79
|
`
|
|
80
80
|
).join(""), s = Array.from(
|
|
81
|
-
{ length:
|
|
81
|
+
{ length: f },
|
|
82
82
|
(d, c) => `
|
|
83
83
|
<div data-custom-delete-key="${w}${c}" style="display: none;">
|
|
84
|
-
<${
|
|
84
|
+
<${_.BUTTON}
|
|
85
85
|
class="custom-attr-delete flat-inline flat-white"
|
|
86
86
|
${O.BUTTON.name}="${w}${c}"
|
|
87
87
|
>
|
|
88
|
-
<${
|
|
88
|
+
<${_.ICON}
|
|
89
89
|
src="delete"
|
|
90
90
|
class="icon-button"
|
|
91
|
-
></${
|
|
92
|
-
</${
|
|
91
|
+
></${_.ICON}>
|
|
92
|
+
</${_.BUTTON}>
|
|
93
93
|
</div>
|
|
94
94
|
`
|
|
95
95
|
).join(""), o = dt.EMAIL_RECOMMENDATION_BLOCK, n = this.api.translate(
|
|
@@ -123,10 +123,10 @@ class se extends ut {
|
|
|
123
123
|
</div>
|
|
124
124
|
|
|
125
125
|
<div class="orderable-list">
|
|
126
|
-
<div class="orderable-item title-item" data-key="${
|
|
127
|
-
<span class="item-label">${this.api.translate(
|
|
126
|
+
<div class="orderable-item title-item" data-key="${R.key}">
|
|
127
|
+
<span class="item-label">${this.api.translate(R.label)}</span>
|
|
128
128
|
<div class="item-action">
|
|
129
|
-
${this._GuToggle(`visibility_${
|
|
129
|
+
${this._GuToggle(`visibility_${R.key}`)}
|
|
130
130
|
</div>
|
|
131
131
|
</div>
|
|
132
132
|
</div>
|
|
@@ -172,12 +172,12 @@ class se extends ut {
|
|
|
172
172
|
this.api.updateValues(s), i && this._initializeCustomSelects(e), this._updateAddButtonState();
|
|
173
173
|
}
|
|
174
174
|
_registerValueChangeListeners() {
|
|
175
|
-
[
|
|
175
|
+
[R, ...m].forEach((t) => {
|
|
176
176
|
this.api.onValueChanged(`visibility_${t.key}`, (e) => {
|
|
177
177
|
this._applyVisibilityToBlock(t.key, e);
|
|
178
178
|
});
|
|
179
179
|
});
|
|
180
|
-
for (let t = 0; t <
|
|
180
|
+
for (let t = 0; t < f; t++) {
|
|
181
181
|
const e = `${A}${t}`, r = t;
|
|
182
182
|
this.api.onValueChanged(e, (i) => {
|
|
183
183
|
this._onCustomAttributeChanged(r, i);
|
|
@@ -193,7 +193,7 @@ class se extends ut {
|
|
|
193
193
|
const t = this.currentNode.getAttribute(K);
|
|
194
194
|
if (t)
|
|
195
195
|
return this._normalizeComposition(t.split(",").filter(Boolean));
|
|
196
|
-
const { composition: e } =
|
|
196
|
+
const { composition: e } = g.getConfig(this.currentNode);
|
|
197
197
|
return e != null && e.length ? this._normalizeComposition([...e]) : [...Y];
|
|
198
198
|
}
|
|
199
199
|
/** Upgrades legacy bare-name custom keys to the canonical form. (SD-147101) */
|
|
@@ -214,19 +214,19 @@ class se extends ut {
|
|
|
214
214
|
} catch {
|
|
215
215
|
return [];
|
|
216
216
|
}
|
|
217
|
-
return this._readCompositionFromNode().filter((e) => e.startsWith(
|
|
217
|
+
return this._readCompositionFromNode().filter((e) => e.startsWith(v)).map(k);
|
|
218
218
|
}
|
|
219
219
|
_readVisibilityFromRows() {
|
|
220
220
|
if (!this.currentNode)
|
|
221
221
|
return this._getDefaultVisibilities();
|
|
222
|
-
const t = Array.from(this.currentNode.querySelectorAll(
|
|
222
|
+
const t = Array.from(this.currentNode.querySelectorAll(N)), e = this._extractVisibilityFromRows(t);
|
|
223
223
|
if (Object.keys(e).length > 0)
|
|
224
224
|
return this._withTitlePresence(this._mergeWithDefaults(e));
|
|
225
|
-
const r =
|
|
225
|
+
const r = g.getConfig(this.currentNode).visibility;
|
|
226
226
|
return this._withTitlePresence(this._mergeWithDefaults({ ...r }));
|
|
227
227
|
}
|
|
228
228
|
_withTitlePresence(t) {
|
|
229
|
-
return t[
|
|
229
|
+
return t[I] = this._hasTitle(), t;
|
|
230
230
|
}
|
|
231
231
|
_hasTitle() {
|
|
232
232
|
var t;
|
|
@@ -240,10 +240,8 @@ class se extends ut {
|
|
|
240
240
|
return t.forEach((r) => {
|
|
241
241
|
if (!("getAttribute" in r))
|
|
242
242
|
return;
|
|
243
|
-
const i = r.getAttribute(D);
|
|
244
|
-
i !== null &&
|
|
245
|
-
e[s] = this._parseVisibilityValue(i);
|
|
246
|
-
});
|
|
243
|
+
const i = Ot(r), s = r.getAttribute(D);
|
|
244
|
+
i && s !== null && (e[i] = this._parseVisibilityValue(s));
|
|
247
245
|
}), e;
|
|
248
246
|
}
|
|
249
247
|
_parseVisibilityValue(t) {
|
|
@@ -255,7 +253,7 @@ class se extends ut {
|
|
|
255
253
|
}), t;
|
|
256
254
|
}
|
|
257
255
|
_buildVisibilityValues(t) {
|
|
258
|
-
return [
|
|
256
|
+
return [R, ...m].reduce((e, r) => (e[`visibility_${r.key}`] = t[r.key] ?? !0, e), {});
|
|
259
257
|
}
|
|
260
258
|
// ========================================================================
|
|
261
259
|
// UI Rendering (Orderable List)
|
|
@@ -272,22 +270,22 @@ class se extends ut {
|
|
|
272
270
|
const i = r.querySelector("[data-composition-list]");
|
|
273
271
|
if (!i)
|
|
274
272
|
return !1;
|
|
275
|
-
const s = this.
|
|
273
|
+
const s = !g.getConfig(this.currentNode).priceMovedToNextLine;
|
|
276
274
|
if (!(i.dataset.inlinePrices !== String(s)) && this._tryReorderInPlace(i, t))
|
|
277
275
|
return !1;
|
|
278
276
|
i.dataset.inlinePrices = String(s);
|
|
279
277
|
const n = new Set(e), l = vt(t);
|
|
280
278
|
let a = 0, d = 0;
|
|
281
279
|
const c = t.map((u) => {
|
|
282
|
-
if (s && (u ===
|
|
280
|
+
if (s && (u === C || u === L))
|
|
283
281
|
return u === l.anchor ? this._createPriceGroupItemHtml(d++, l.originalFirst) : "";
|
|
284
|
-
if (
|
|
285
|
-
const
|
|
286
|
-
return this._createBuiltInItemHtml(
|
|
282
|
+
if (xt.has(u)) {
|
|
283
|
+
const b = m.find((S) => S.key === u);
|
|
284
|
+
return this._createBuiltInItemHtml(b, d++);
|
|
287
285
|
}
|
|
288
|
-
if (u.startsWith(
|
|
289
|
-
const
|
|
290
|
-
if (n.has(
|
|
286
|
+
if (u.startsWith(v)) {
|
|
287
|
+
const b = k(u);
|
|
288
|
+
if (n.has(b))
|
|
291
289
|
return this._createCustomItemHtml(u, a++, d++);
|
|
292
290
|
}
|
|
293
291
|
return "";
|
|
@@ -308,7 +306,7 @@ class se extends ut {
|
|
|
308
306
|
if (i.length !== e.length)
|
|
309
307
|
return !1;
|
|
310
308
|
const s = [...i].sort().join(","), o = [...e].sort().join(",");
|
|
311
|
-
if (s !== o || e.some((a) => a.startsWith(
|
|
309
|
+
if (s !== o || e.some((a) => a.startsWith(v)))
|
|
312
310
|
return !1;
|
|
313
311
|
const n = /* @__PURE__ */ new Map();
|
|
314
312
|
r.forEach((a) => {
|
|
@@ -346,18 +344,18 @@ class se extends ut {
|
|
|
346
344
|
*/
|
|
347
345
|
_createPriceGroupItemHtml(t, e) {
|
|
348
346
|
var n, l;
|
|
349
|
-
const r = ((n = m.find((a) => a.key ===
|
|
347
|
+
const r = ((n = m.find((a) => a.key === C)) == null ? void 0 : n.label) ?? "Product Price", i = ((l = m.find((a) => a.key === L)) == null ? void 0 : l.label) ?? "Product Original Price", s = (a, d) => `
|
|
350
348
|
<div class="price-suborderable-item" draggable="true" data-subkey="${a}">
|
|
351
349
|
<span class="sub-drag-handle">${qt}</span>
|
|
352
350
|
<span class="item-label">${this.api.translate(d)}</span>
|
|
353
|
-
</div>`, o = e ? s(
|
|
351
|
+
</div>`, o = e ? s(L, i) + s(C, r) : s(C, r) + s(L, i);
|
|
354
352
|
return `
|
|
355
353
|
<div class="orderable-item price-group-item" draggable="true"
|
|
356
|
-
data-key="${
|
|
354
|
+
data-key="${C}" data-group="prices">
|
|
357
355
|
<div class="price-group-header">
|
|
358
356
|
<span class="guido-drag-handle" data-reorder-icon-slot="${t}"></span>
|
|
359
357
|
<span class="item-label">${this.api.translate("Product Prices")}</span>
|
|
360
|
-
<div class="item-action" data-action-for="${
|
|
358
|
+
<div class="item-action" data-action-for="${C}"></div>
|
|
361
359
|
</div>
|
|
362
360
|
<div class="price-suborderable-list">${o}</div>
|
|
363
361
|
</div>
|
|
@@ -397,13 +395,13 @@ class se extends ut {
|
|
|
397
395
|
const i = /* @__PURE__ */ new Map();
|
|
398
396
|
r.forEach((o) => i.set(o.attributeName, (i.get(o.attributeName) ?? 0) + 1));
|
|
399
397
|
const s = new Set(e);
|
|
400
|
-
return s.delete(t), r.filter((o) => !s.has(
|
|
398
|
+
return s.delete(t), r.filter((o) => !s.has(T(o))).map((o) => ({
|
|
401
399
|
text: this._toOptionLabel(
|
|
402
400
|
o.displayName,
|
|
403
401
|
o.type === "defaultAttribute",
|
|
404
402
|
(i.get(o.attributeName) ?? 0) > 1
|
|
405
403
|
),
|
|
406
|
-
value:
|
|
404
|
+
value: T(o)
|
|
407
405
|
}));
|
|
408
406
|
}
|
|
409
407
|
/**
|
|
@@ -465,7 +463,7 @@ class se extends ut {
|
|
|
465
463
|
* Same rescue pattern as _rescueTogglesToStore — prevents innerHTML from destroying them.
|
|
466
464
|
*/
|
|
467
465
|
_rescueSelectsToStore(t) {
|
|
468
|
-
for (let e = 0; e <
|
|
466
|
+
for (let e = 0; e < f; e++) {
|
|
469
467
|
const r = `${A}${e}`, i = t.querySelector(`[data-custom-select-key="${r}"]`), s = t.querySelector(`[data-custom-select-slot="${e}"]`);
|
|
470
468
|
if (s) {
|
|
471
469
|
const o = s.querySelector("ue-select");
|
|
@@ -491,7 +489,7 @@ class se extends ut {
|
|
|
491
489
|
* Same rescue pattern as _rescueSelectsToStore — prevents innerHTML from destroying them.
|
|
492
490
|
*/
|
|
493
491
|
_rescueDeleteButtonsToStore(t) {
|
|
494
|
-
for (let e = 0; e <
|
|
492
|
+
for (let e = 0; e < f; e++) {
|
|
495
493
|
const r = `${w}${e}`, i = t.querySelector(`[data-custom-delete-key="${r}"]`), s = t.querySelector(`[data-custom-delete-slot="${e}"]`);
|
|
496
494
|
if (s) {
|
|
497
495
|
const o = s.querySelector("ue-button");
|
|
@@ -517,7 +515,7 @@ class se extends ut {
|
|
|
517
515
|
* Same rescue pattern as _rescueDeleteButtonsToStore — prevents innerHTML from destroying them.
|
|
518
516
|
*/
|
|
519
517
|
_rescueReorderIconsToStore(t) {
|
|
520
|
-
const e = m.length +
|
|
518
|
+
const e = m.length + f;
|
|
521
519
|
for (let r = 0; r < e; r++) {
|
|
522
520
|
const i = `${P}${r}`, s = t.querySelector(`[data-reorder-icon-key="${i}"]`), o = t.querySelector(`[data-reorder-icon-slot="${r}"]`);
|
|
523
521
|
if (o) {
|
|
@@ -536,8 +534,8 @@ class se extends ut {
|
|
|
536
534
|
return;
|
|
537
535
|
const r = e.querySelector("[data-composition-list]"), i = e.querySelector("#guido__btn-add-attribute");
|
|
538
536
|
r && (this._setupDragAndDrop(r, t), this._setupDeleteHandler(r, t)), i && i.addEventListener("click", () => {
|
|
539
|
-
const s = new Set(this._readCustomAttributesFromNode()), o = this._getAddableFilters().find((n) => !s.has(
|
|
540
|
-
o && this._onAddAttribute(
|
|
537
|
+
const s = new Set(this._readCustomAttributesFromNode()), o = this._getAddableFilters().find((n) => !s.has(T(n)));
|
|
538
|
+
o && this._onAddAttribute(T(o), o.displayName);
|
|
541
539
|
}, { signal: t });
|
|
542
540
|
}
|
|
543
541
|
/**
|
|
@@ -648,11 +646,11 @@ class se extends ut {
|
|
|
648
646
|
this._updateBothAttributes(o, r), this._injectCustomAttributeHtml(e, l, s, o), this._renderOrderableItems(o, r), this._initializeCustomSelects(r);
|
|
649
647
|
}
|
|
650
648
|
_onReorder(t) {
|
|
651
|
-
const e = t.filter((r) => r.startsWith(
|
|
649
|
+
const e = t.filter((r) => r.startsWith(v)).map(k);
|
|
652
650
|
this.reorderInProgress = !0;
|
|
653
651
|
try {
|
|
654
652
|
this._updateBothAttributes(t, e);
|
|
655
|
-
const r = this.
|
|
653
|
+
const r = !g.getConfig(this.currentNode).priceMovedToNextLine;
|
|
656
654
|
this._getCurrentLayout() === "grid" && !r ? this._reorderProductAttributes(t) : this.currentNode && Bt({
|
|
657
655
|
currentNode: this.currentNode,
|
|
658
656
|
documentModifier: this.api.getDocumentModifier()
|
|
@@ -675,7 +673,7 @@ class se extends ut {
|
|
|
675
673
|
if (r && "getOuterHTML" in r)
|
|
676
674
|
return Q(r.getOuterHTML(), e);
|
|
677
675
|
const i = t.querySelector(
|
|
678
|
-
`${
|
|
676
|
+
`${N}[${E}="${e}"]`
|
|
679
677
|
);
|
|
680
678
|
return i && "getOuterHTML" in i ? Q(i.getOuterHTML(), e) : "";
|
|
681
679
|
}
|
|
@@ -688,15 +686,15 @@ class se extends ut {
|
|
|
688
686
|
const s = this.currentNode.querySelectorAll(U);
|
|
689
687
|
if (!(s != null && s.length))
|
|
690
688
|
return;
|
|
691
|
-
const o =
|
|
689
|
+
const o = g.getConfig(this.currentNode), l = `0 ${Math.floor(o.columnSpacing / 2)}px`, a = this.api.getDocumentModifier(), d = this.store.recommendationProducts.length;
|
|
692
690
|
let c = 0;
|
|
693
691
|
s.forEach((u) => {
|
|
694
692
|
var V;
|
|
695
|
-
const
|
|
693
|
+
const b = u.querySelector(N), S = ((V = b == null ? void 0 : b.querySelectorAll(`.${bt}`)) == null ? void 0 : V.length) || 1, F = (100 / S).toFixed(2), { bgStyle: et, bgAttr: rt } = this._extractSegmentBgFromCard(u), B = d > 0 ? Math.min(S, d - c) : S, it = i.map((j) => {
|
|
696
694
|
if (j === r) {
|
|
697
695
|
const st = Array.from(
|
|
698
696
|
{ length: B },
|
|
699
|
-
(
|
|
697
|
+
(Ft, nt) => {
|
|
700
698
|
const lt = this._resolveAttributeContent(
|
|
701
699
|
t,
|
|
702
700
|
e,
|
|
@@ -705,14 +703,14 @@ class se extends ut {
|
|
|
705
703
|
return this._getGridCellHtml(
|
|
706
704
|
t,
|
|
707
705
|
lt,
|
|
708
|
-
|
|
706
|
+
F,
|
|
709
707
|
et,
|
|
710
708
|
rt,
|
|
711
709
|
l
|
|
712
710
|
);
|
|
713
711
|
}
|
|
714
|
-
).join(""), ot = Ct(
|
|
715
|
-
return `<tr class="${G}" ${
|
|
712
|
+
).join(""), ot = Ct(F, l).repeat(S - B);
|
|
713
|
+
return `<tr class="${G}" ${E}="${r}" ${D}="1">${st}${ot}</tr>`;
|
|
716
714
|
}
|
|
717
715
|
return this._getExistingRowHtml(u, j);
|
|
718
716
|
}).join("");
|
|
@@ -723,7 +721,7 @@ class se extends ut {
|
|
|
723
721
|
const s = this.currentNode.querySelectorAll(Z);
|
|
724
722
|
if (!(s != null && s.length))
|
|
725
723
|
return;
|
|
726
|
-
const o = i.filter((l) => l !== q && l !==
|
|
724
|
+
const o = i.filter((l) => l !== q && l !== x), n = this.api.getDocumentModifier();
|
|
727
725
|
s.forEach((l, a) => {
|
|
728
726
|
const d = o.map((c) => {
|
|
729
727
|
if (c === r) {
|
|
@@ -750,7 +748,7 @@ class se extends ut {
|
|
|
750
748
|
r.modifyHtml(s).setInnerHtml(o);
|
|
751
749
|
});
|
|
752
750
|
} else {
|
|
753
|
-
const i = t.filter((o) => o !== q && o !==
|
|
751
|
+
const i = t.filter((o) => o !== q && o !== x), s = this.currentNode.querySelectorAll(Z);
|
|
754
752
|
s == null || s.forEach((o) => {
|
|
755
753
|
const n = this._buildCompositionHtml(o, i);
|
|
756
754
|
r.modifyHtml(o).setInnerHtml(n);
|
|
@@ -772,7 +770,7 @@ class se extends ut {
|
|
|
772
770
|
if (!this.currentNode)
|
|
773
771
|
return;
|
|
774
772
|
const r = {
|
|
775
|
-
...
|
|
773
|
+
...g.getConfig(this.currentNode),
|
|
776
774
|
composition: t
|
|
777
775
|
};
|
|
778
776
|
this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute(K, t.join(",")).setAttribute(W, JSON.stringify(e)).setNodeConfig(r).apply(new y(this.api.translate("Update card composition")));
|
|
@@ -806,47 +804,37 @@ class se extends ut {
|
|
|
806
804
|
_applyVisibilityToBlock(t, e) {
|
|
807
805
|
if (!this.currentNode)
|
|
808
806
|
return;
|
|
809
|
-
if (t ===
|
|
807
|
+
if (t === I) {
|
|
810
808
|
this._applyTitleVisibilityToBlock(e);
|
|
811
809
|
return;
|
|
812
810
|
}
|
|
813
|
-
const r = this.
|
|
814
|
-
if (!
|
|
811
|
+
const r = this.currentNode.querySelectorAll(`${N}[${E}="${t}"]`);
|
|
812
|
+
if (!(r != null && r.length))
|
|
815
813
|
return;
|
|
816
|
-
const
|
|
817
|
-
|
|
818
|
-
const
|
|
819
|
-
|
|
814
|
+
const i = e ? "1" : "0", s = e ? this.api.translate("visible") : this.api.translate("hidden"), o = `${this.api.translate("Set visibility")}: ${t} → ${s}`, n = this.api.getDocumentModifier();
|
|
815
|
+
r.forEach((a) => {
|
|
816
|
+
const d = Pt(a), c = e ? d : "none";
|
|
817
|
+
n.modifyHtml(a).setStyle("display", c).setAttribute(D, i);
|
|
820
818
|
});
|
|
821
|
-
const
|
|
822
|
-
...
|
|
823
|
-
visibility: {
|
|
824
|
-
...this._readVisibilityFromRows(),
|
|
825
|
-
...Object.fromEntries(r.map((c) => [c, e]))
|
|
826
|
-
}
|
|
819
|
+
const l = {
|
|
820
|
+
...g.getConfig(this.currentNode),
|
|
821
|
+
visibility: { ...this._readVisibilityFromRows(), [t]: e }
|
|
827
822
|
};
|
|
828
|
-
|
|
829
|
-
}
|
|
830
|
-
/** Inline "Product Prices" group row is tagged with whichever price comes first, so it drives both keys. */
|
|
831
|
-
_resolveVisibilityKeys(t) {
|
|
832
|
-
return this._isInlinePrices() && t === p ? [p, I] : [t];
|
|
833
|
-
}
|
|
834
|
-
_isInlinePrices() {
|
|
835
|
-
return !T.getConfig(this.currentNode).priceMovedToNextLine;
|
|
823
|
+
n.modifyHtml(this.currentNode).setNodeConfig(l), n.apply(new y(o));
|
|
836
824
|
}
|
|
837
825
|
_applyTitleVisibilityToBlock(t) {
|
|
838
|
-
const e =
|
|
826
|
+
const e = g.getConfig(this.currentNode), r = t ? this._resolveTitleInjection(e) : null, i = t ? [] : this._findTitleRows(), s = t ? this._hasTitle() || !r : i.length === 0;
|
|
839
827
|
if (!this.currentNode || s)
|
|
840
828
|
return;
|
|
841
829
|
const o = this.api.getDocumentModifier();
|
|
842
830
|
r ? o.modifyHtml(r.containerBody).setInnerHtml(r.html) : i.forEach((l) => o.modifyHtml(l).delete()), o.modifyHtml(this.currentNode).setNodeConfig({
|
|
843
831
|
...e,
|
|
844
832
|
previousTitleHtml: t ? e.previousTitleHtml : this._readTitleHtml(i),
|
|
845
|
-
visibility: { ...this._readVisibilityFromRows(), [
|
|
833
|
+
visibility: { ...this._readVisibilityFromRows(), [I]: t }
|
|
846
834
|
});
|
|
847
835
|
const n = t ? this.api.translate("visible") : this.api.translate("hidden");
|
|
848
836
|
o.apply(new y(
|
|
849
|
-
`${this.api.translate("Set visibility")}: ${
|
|
837
|
+
`${this.api.translate("Set visibility")}: ${I} → ${n}`
|
|
850
838
|
));
|
|
851
839
|
}
|
|
852
840
|
_resolveTitleInjection(t) {
|
|
@@ -862,7 +850,7 @@ class se extends ut {
|
|
|
862
850
|
_findTitleRows() {
|
|
863
851
|
var e;
|
|
864
852
|
const t = Array.from(((e = this.currentNode) == null ? void 0 : e.querySelectorAll(
|
|
865
|
-
`${
|
|
853
|
+
`${N}[${E}="${I}"]`
|
|
866
854
|
)) ?? []);
|
|
867
855
|
return t.length > 0 ? t : this._findTitleRowsByClass();
|
|
868
856
|
}
|
|
@@ -896,7 +884,7 @@ class se extends ut {
|
|
|
896
884
|
_findNthCustomKeyIndex(t, e) {
|
|
897
885
|
let r = 0;
|
|
898
886
|
for (let i = 0; i < t.length; i++)
|
|
899
|
-
if (t[i].startsWith(
|
|
887
|
+
if (t[i].startsWith(v)) {
|
|
900
888
|
if (r === e)
|
|
901
889
|
return i;
|
|
902
890
|
r++;
|
|
@@ -956,7 +944,7 @@ class se extends ut {
|
|
|
956
944
|
* or when all available filters have already been added (no unused attributes left).
|
|
957
945
|
*/
|
|
958
946
|
_updateAddButtonState() {
|
|
959
|
-
const t = this._readCustomAttributesFromNode(), e = t.length >=
|
|
947
|
+
const t = this._readCustomAttributesFromNode(), e = t.length >= f, r = new Set(t), i = this._getAddableFilters(), s = i.length > 0 && i.every((o) => r.has(T(o)));
|
|
960
948
|
this.api.setUIEAttribute(
|
|
961
949
|
tt.ADD_ATTRIBUTE,
|
|
962
950
|
O.BUTTON.disabled,
|
|
@@ -989,7 +977,7 @@ class se extends ut {
|
|
|
989
977
|
_getAddableFilters() {
|
|
990
978
|
const t = /* @__PURE__ */ new Set();
|
|
991
979
|
return Object.values(this.store.filterList).filter((e) => !(e.type === "defaultAttribute" && gt.has(e.attributeName))).filter((e) => {
|
|
992
|
-
const r =
|
|
980
|
+
const r = T(e);
|
|
993
981
|
return t.has(r) ? !1 : (t.add(r), !0);
|
|
994
982
|
});
|
|
995
983
|
}
|
|
@@ -999,7 +987,7 @@ class se extends ut {
|
|
|
999
987
|
* resolve to their own entry. Falls back to Title Case of the bare name.
|
|
1000
988
|
*/
|
|
1001
989
|
_getDisplayNameForAttribute(t) {
|
|
1002
|
-
const e = Object.values(this.store.filterList).find((r) =>
|
|
990
|
+
const e = Object.values(this.store.filterList).find((r) => T(r) === t);
|
|
1003
991
|
return e ? e.displayName : Nt(H(t));
|
|
1004
992
|
}
|
|
1005
993
|
/**
|
|
@@ -1027,7 +1015,7 @@ class se extends ut {
|
|
|
1027
1015
|
[i]: e,
|
|
1028
1016
|
product_attributes: { [i]: e }
|
|
1029
1017
|
}, l = s[r](o).replace(/<tr>/, "").replace(/<\/tr>/, "");
|
|
1030
|
-
return `<tr class="${G}" ${
|
|
1018
|
+
return `<tr class="${G}" ${E}="${r}" ${D}="1">${l}</tr>`;
|
|
1031
1019
|
}
|
|
1032
1020
|
}
|
|
1033
1021
|
export {
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { extractWrapperTags as
|
|
1
|
+
import { extractWrapperTags as C } from "../../../../utils/preserveTextStyles.js";
|
|
2
2
|
import { RecommendationBlockId as c } from "../constants/blockIds.js";
|
|
3
|
-
import { DESKTOP_CONTAINER_SELECTOR as
|
|
4
|
-
import { CSS_CLASS_TEXT_TRIM as
|
|
5
|
-
import { toCustomCompositionKey as
|
|
6
|
-
import {
|
|
7
|
-
import { hasQuerySelectorAll as
|
|
3
|
+
import { DESKTOP_CONTAINER_SELECTOR as S, ATTR_PRODUCT_NAME as E, ATTR_PRODUCT_PRICE as p, ATTR_PRODUCT_OLD_PRICE as y, ATTR_PRODUCT_OMNIBUS_PRICE as A, ATTR_PRODUCT_OMNIBUS_DISCOUNT as R, ATTR_PRODUCT_BUTTON as P, ATTR_PRODUCT_IMAGE as q, ATTR_PRODUCT_ATTR as x } from "../constants/selectors.js";
|
|
4
|
+
import { CSS_CLASS_TEXT_TRIM as v } from "../controls/shared/textTrimCssRules.js";
|
|
5
|
+
import { toCustomCompositionKey as B } from "../templates/utils.js";
|
|
6
|
+
import { resolveRowCompositionKey as U } from "./compositionKeys.js";
|
|
7
|
+
import { hasQuerySelectorAll as _, hasGetAttribute as l, hasGetStyle as I, hasGetComputedStyle as N } from "./tagName.js";
|
|
8
8
|
const s = [
|
|
9
9
|
"font-size",
|
|
10
10
|
"font-family",
|
|
@@ -14,14 +14,14 @@ const s = [
|
|
|
14
14
|
"text-align",
|
|
15
15
|
"line-height",
|
|
16
16
|
"text-decoration"
|
|
17
|
-
],
|
|
17
|
+
], M = [
|
|
18
18
|
"background",
|
|
19
19
|
"background-color",
|
|
20
20
|
"border-width",
|
|
21
21
|
"border-color",
|
|
22
22
|
"border-style",
|
|
23
23
|
"border-radius"
|
|
24
|
-
],
|
|
24
|
+
], D = [
|
|
25
25
|
...s,
|
|
26
26
|
"background",
|
|
27
27
|
"background-color",
|
|
@@ -40,47 +40,47 @@ const s = [
|
|
|
40
40
|
"border-radius",
|
|
41
41
|
"margin"
|
|
42
42
|
], g = /* @__PURE__ */ new Set(["transparent", "rgba(0, 0, 0, 0)"]), L = [
|
|
43
|
-
{ attrKey:
|
|
44
|
-
{ attrKey:
|
|
45
|
-
{ attrKey:
|
|
46
|
-
{ attrKey:
|
|
47
|
-
{ attrKey:
|
|
48
|
-
{ attrKey:
|
|
43
|
+
{ attrKey: E, blockId: c.NAME, kind: "text" },
|
|
44
|
+
{ attrKey: p, blockId: c.PRICE, kind: "text" },
|
|
45
|
+
{ attrKey: y, blockId: c.OLD_PRICE, kind: "text" },
|
|
46
|
+
{ attrKey: A, blockId: c.OMNIBUS_PRICE, kind: "text" },
|
|
47
|
+
{ attrKey: R, blockId: c.OMNIBUS_DISCOUNT, kind: "text" },
|
|
48
|
+
{ attrKey: P, blockId: c.BUTTON, kind: "button" },
|
|
49
49
|
{ attrKey: q, blockId: c.IMAGE, kind: "image" }
|
|
50
50
|
];
|
|
51
|
-
function
|
|
51
|
+
function O(t) {
|
|
52
52
|
return t && "getInnerHTML" in t && typeof t.getInnerHTML == "function" ? t.getInnerHTML().trim() : "";
|
|
53
53
|
}
|
|
54
|
-
function
|
|
54
|
+
function w(t) {
|
|
55
55
|
return t && "getInnerText" in t && typeof t.getInnerText == "function" ? t.getInnerText().trim() : "";
|
|
56
56
|
}
|
|
57
57
|
function a(t, e, r) {
|
|
58
|
-
!e || !
|
|
58
|
+
!e || !I(e) || r.forEach((n) => {
|
|
59
59
|
const o = e.getStyle(n);
|
|
60
60
|
o && o !== "inherit" && o !== "initial" && (t[n] = o);
|
|
61
61
|
});
|
|
62
62
|
}
|
|
63
|
-
function
|
|
63
|
+
function h(t) {
|
|
64
64
|
return Object.entries(t).map(([e, r]) => `${e}: ${r};`).join(" ");
|
|
65
65
|
}
|
|
66
|
-
function
|
|
67
|
-
if (!t || !
|
|
66
|
+
function k(t) {
|
|
67
|
+
if (!t || !I(t))
|
|
68
68
|
return;
|
|
69
69
|
const e = t.getStyle("background-color") || t.getStyle("background");
|
|
70
70
|
return e && !g.has(e) ? e : void 0;
|
|
71
71
|
}
|
|
72
|
-
function
|
|
72
|
+
function b(t, e) {
|
|
73
73
|
const r = {};
|
|
74
|
-
return a(r, t, e),
|
|
74
|
+
return a(r, t, e), h(r);
|
|
75
75
|
}
|
|
76
|
-
function
|
|
76
|
+
function K(t) {
|
|
77
77
|
const e = t.querySelector("p"), r = {};
|
|
78
78
|
a(r, t, s), a(r, e, s), a(r, t.querySelector("strong"), s), a(r, t.querySelector("em"), s), a(r, t.querySelector("s"), s);
|
|
79
|
-
const n =
|
|
79
|
+
const n = h(r), { openTags: o, closeTags: i } = C(O(e));
|
|
80
80
|
return !n && !o ? null : { pStyle: n || void 0, openTags: o, closeTags: i };
|
|
81
81
|
}
|
|
82
|
-
function
|
|
83
|
-
const e = t.querySelector(".es-button-border"), r = t.querySelector("a.es-button") ?? t.querySelector("a"), n =
|
|
82
|
+
function $(t) {
|
|
83
|
+
const e = t.querySelector(".es-button-border"), r = t.querySelector("a.es-button") ?? t.querySelector("a"), n = b(e, M), o = b(r, D), i = e && "getAttribute" in e ? e.getAttribute("class") ?? "" : "", u = /\bes-fw\b/.test(i), { openTags: T, closeTags: d } = C(O(r)), m = w(r);
|
|
84
84
|
return !n && !o && !u && !T && !m ? null : {
|
|
85
85
|
buttonBorderStyle: n || void 0,
|
|
86
86
|
buttonAnchorStyle: o || void 0,
|
|
@@ -90,44 +90,44 @@ function H(t) {
|
|
|
90
90
|
closeTags: d
|
|
91
91
|
};
|
|
92
92
|
}
|
|
93
|
-
function
|
|
94
|
-
const e =
|
|
93
|
+
function H(t) {
|
|
94
|
+
const e = b(t.querySelector("img"), G);
|
|
95
95
|
return e ? { imgStyle: e } : null;
|
|
96
96
|
}
|
|
97
|
-
function
|
|
98
|
-
return e === "button" ?
|
|
97
|
+
function F(t, e) {
|
|
98
|
+
return e === "button" ? $(t) : e === "image" ? H(t) : K(t);
|
|
99
99
|
}
|
|
100
100
|
function f(t, e) {
|
|
101
101
|
if (!t || !("querySelector" in t))
|
|
102
102
|
return;
|
|
103
|
-
const r = t.querySelector(
|
|
103
|
+
const r = t.querySelector(S) ?? t;
|
|
104
104
|
if (L.forEach(({ attrKey: i, blockId: u, kind: T }) => {
|
|
105
105
|
const d = r.querySelector(`[esd-extension-block-id="${u}"]`);
|
|
106
106
|
d && e(d, i, T);
|
|
107
|
-
}), !
|
|
107
|
+
}), !_(r))
|
|
108
108
|
return;
|
|
109
109
|
const n = /* @__PURE__ */ new Set();
|
|
110
110
|
r.querySelectorAll(
|
|
111
111
|
`[esd-extension-block-id="${c.CUSTOM_ATTRIBUTE}"]`
|
|
112
112
|
).forEach((i) => {
|
|
113
|
-
const u = l(i) ? i.getAttribute(
|
|
114
|
-
!u || n.has(u) || (n.add(u), e(i,
|
|
113
|
+
const u = l(i) ? i.getAttribute(x) : null;
|
|
114
|
+
!u || n.has(u) || (n.add(u), e(i, B(u), "text"));
|
|
115
115
|
});
|
|
116
116
|
}
|
|
117
|
-
function
|
|
117
|
+
function j(t) {
|
|
118
118
|
const e = {};
|
|
119
119
|
return f(t, (r, n, o) => {
|
|
120
120
|
if (!("querySelector" in r))
|
|
121
121
|
return;
|
|
122
|
-
const i =
|
|
122
|
+
const i = F(r, o);
|
|
123
123
|
i && (e[n] = i);
|
|
124
124
|
}), e;
|
|
125
125
|
}
|
|
126
126
|
function X(t) {
|
|
127
127
|
if (!t || !("querySelector" in t))
|
|
128
128
|
return;
|
|
129
|
-
const e = t.querySelector(
|
|
130
|
-
return
|
|
129
|
+
const e = t.querySelector(S) ?? t, r = e.querySelector(".product-card-segment") ?? e.querySelector(".product-card-wrapper");
|
|
130
|
+
return k(r);
|
|
131
131
|
}
|
|
132
132
|
function z(t) {
|
|
133
133
|
if (!t)
|
|
@@ -135,10 +135,10 @@ function z(t) {
|
|
|
135
135
|
const e = l(t) ? t.getAttribute("bgcolor") : null;
|
|
136
136
|
if (e && !g.has(e))
|
|
137
137
|
return e;
|
|
138
|
-
const r =
|
|
138
|
+
const r = k(t);
|
|
139
139
|
if (r)
|
|
140
140
|
return r;
|
|
141
|
-
const n =
|
|
141
|
+
const n = N(t) ? t.getComputedStyle("background-color") : void 0;
|
|
142
142
|
return n && !g.has(n) ? n : void 0;
|
|
143
143
|
}
|
|
144
144
|
function Q(t) {
|
|
@@ -150,7 +150,7 @@ function Q(t) {
|
|
|
150
150
|
i && (e[n] = i);
|
|
151
151
|
}), e;
|
|
152
152
|
}
|
|
153
|
-
function
|
|
153
|
+
function V(t) {
|
|
154
154
|
const e = {};
|
|
155
155
|
return f(t, (r, n, o) => {
|
|
156
156
|
if (o === "image")
|
|
@@ -159,70 +159,68 @@ function W(t) {
|
|
|
159
159
|
i && (e[n] = i);
|
|
160
160
|
}), e;
|
|
161
161
|
}
|
|
162
|
-
const
|
|
163
|
-
function
|
|
162
|
+
const W = /^es-[pm]\d+[trbl]?$/;
|
|
163
|
+
function Y(t) {
|
|
164
164
|
const e = l(t) ? t.getAttribute("class") : null;
|
|
165
165
|
if (!e)
|
|
166
166
|
return;
|
|
167
|
-
const r = e.split(/\s+/).filter((n) =>
|
|
167
|
+
const r = e.split(/\s+/).filter((n) => W.test(n) || n === v);
|
|
168
168
|
return r.length ? r.join(" ") : void 0;
|
|
169
169
|
}
|
|
170
|
-
function
|
|
170
|
+
function J(t) {
|
|
171
171
|
if (!t || !("querySelector" in t))
|
|
172
172
|
return !1;
|
|
173
|
-
const e = t.querySelector(
|
|
174
|
-
return
|
|
173
|
+
const e = t.querySelector(S) ?? t, r = (n) => !!(n && "querySelector" in n && n.querySelector(".product-price") && n.querySelector(".product-old-price"));
|
|
174
|
+
return r(e.querySelector(`[data-attribute-type="${p}"]`)) || r(e.querySelector(`[data-attribute-type="${y}"]`));
|
|
175
175
|
}
|
|
176
|
-
function
|
|
177
|
-
const e = {}, r =
|
|
176
|
+
function Z(t) {
|
|
177
|
+
const e = {}, r = J(t);
|
|
178
178
|
return f(t, (n, o, i) => {
|
|
179
|
-
if (i === "image" || r && (o ===
|
|
179
|
+
if (i === "image" || r && (o === p || o === y))
|
|
180
180
|
return;
|
|
181
|
-
const u =
|
|
181
|
+
const u = Y(n);
|
|
182
182
|
u && (e[o] = u);
|
|
183
183
|
}), e;
|
|
184
184
|
}
|
|
185
|
-
function
|
|
185
|
+
function tt(t) {
|
|
186
186
|
const e = {};
|
|
187
187
|
return f(t, (r, n) => {
|
|
188
|
-
if (n !==
|
|
188
|
+
if (n !== A && n !== R || !l(r))
|
|
189
189
|
return;
|
|
190
190
|
const o = r.getAttribute("data-text-before"), i = r.getAttribute("data-text-after");
|
|
191
191
|
(o != null || i != null) && (e[n] = { before: o ?? void 0, after: i ?? void 0 });
|
|
192
192
|
}), e;
|
|
193
193
|
}
|
|
194
|
-
function
|
|
194
|
+
function et(t) {
|
|
195
195
|
const e = {};
|
|
196
196
|
if (!t || !("querySelector" in t))
|
|
197
197
|
return e;
|
|
198
|
-
const r = t.querySelector(
|
|
199
|
-
return
|
|
198
|
+
const r = t.querySelector(S) ?? t;
|
|
199
|
+
return _(r) && r.querySelectorAll(".recommendation-attribute-row").forEach((n) => {
|
|
200
200
|
if (!l(n))
|
|
201
201
|
return;
|
|
202
|
-
const o = n.getAttribute("data-visibility");
|
|
203
|
-
o != null &&
|
|
204
|
-
e[i] = o !== "0";
|
|
205
|
-
});
|
|
202
|
+
const o = U(n), i = n.getAttribute("data-visibility");
|
|
203
|
+
o && i != null && (e[o] = i !== "0");
|
|
206
204
|
}), e;
|
|
207
205
|
}
|
|
208
|
-
function
|
|
206
|
+
function at(t) {
|
|
209
207
|
return {
|
|
210
|
-
styleTemplates:
|
|
208
|
+
styleTemplates: j(t),
|
|
211
209
|
cardBackgroundColor: X(t),
|
|
212
210
|
cellBackgroundColors: Q(t),
|
|
213
|
-
cellAlignments:
|
|
214
|
-
cellClasses:
|
|
215
|
-
omnibusTexts:
|
|
216
|
-
visibility:
|
|
211
|
+
cellAlignments: V(t),
|
|
212
|
+
cellClasses: Z(t),
|
|
213
|
+
omnibusTexts: tt(t),
|
|
214
|
+
visibility: et(t)
|
|
217
215
|
};
|
|
218
216
|
}
|
|
219
217
|
export {
|
|
220
|
-
|
|
218
|
+
j as captureAttributeStyleTemplates,
|
|
221
219
|
X as captureCardBackgroundColor,
|
|
222
|
-
|
|
220
|
+
V as captureCellAlignments,
|
|
223
221
|
Q as captureCellBackgroundColors,
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
222
|
+
Z as captureCellClasses,
|
|
223
|
+
tt as captureOmnibusTexts,
|
|
224
|
+
at as captureStyles,
|
|
225
|
+
et as captureVisibility
|
|
228
226
|
};
|
|
@@ -1,98 +1,89 @@
|
|
|
1
|
-
import { ATTR_CUSTOM_PREFIX as
|
|
2
|
-
function
|
|
3
|
-
return !t.startsWith(
|
|
1
|
+
import { ATTR_CUSTOM_PREFIX as s, ATTR_PRODUCT_ATTR as i, PRODUCT_ATTRIBUTE_PREFIX as f, ATTR_DATA_ATTRIBUTE_TYPE as l, SELECTOR_ATTRIBUTE_ROW as R } from "../constants/selectors.js";
|
|
2
|
+
function d(t) {
|
|
3
|
+
return !t.startsWith(f);
|
|
4
4
|
}
|
|
5
|
-
function
|
|
6
|
-
return t.startsWith(
|
|
7
|
-
}
|
|
8
|
-
function A(t) {
|
|
9
|
-
return t.startsWith(o) ? t.substring(o.length) : t;
|
|
5
|
+
function y(t) {
|
|
6
|
+
return t.startsWith(f) ? t.substring(f.length) : t;
|
|
10
7
|
}
|
|
11
8
|
function T(t) {
|
|
12
|
-
return
|
|
9
|
+
return t.startsWith(s) ? t.substring(s.length) : t;
|
|
10
|
+
}
|
|
11
|
+
function A(t) {
|
|
12
|
+
return `${s}${t}`;
|
|
13
13
|
}
|
|
14
|
-
function
|
|
15
|
-
return t.type === "defaultAttribute" ? t.attributeName : `${
|
|
14
|
+
function P(t) {
|
|
15
|
+
return t.type === "defaultAttribute" ? t.attributeName : `${f}${t.attributeName}`;
|
|
16
16
|
}
|
|
17
|
-
function
|
|
17
|
+
function _(t, r) {
|
|
18
18
|
const n = Object.values(r).filter((e) => e.attributeName === t);
|
|
19
19
|
return n.find((e) => e.type === "defaultAttribute") ?? n[0];
|
|
20
20
|
}
|
|
21
|
-
function
|
|
21
|
+
function a(t, r) {
|
|
22
22
|
return t && "getAttribute" in t ? t.getAttribute(r) : null;
|
|
23
23
|
}
|
|
24
|
-
function
|
|
25
|
-
const e = `${
|
|
26
|
-
`${
|
|
27
|
-
),
|
|
28
|
-
if (
|
|
29
|
-
return
|
|
30
|
-
const
|
|
31
|
-
return
|
|
24
|
+
function m(t, r, n = {}) {
|
|
25
|
+
const e = `${s}${t}`, u = r == null ? void 0 : r.querySelector(
|
|
26
|
+
`${R}[${l}="${e}"]`
|
|
27
|
+
), c = a(u, i) ?? a(u == null ? void 0 : u.querySelector(`[${i}]`), i);
|
|
28
|
+
if (c)
|
|
29
|
+
return c;
|
|
30
|
+
const o = _(t, n);
|
|
31
|
+
return o ? P(o) : t;
|
|
32
32
|
}
|
|
33
|
-
function
|
|
34
|
-
return t.startsWith(
|
|
33
|
+
function g(t, r, n = {}) {
|
|
34
|
+
return t.startsWith(f) ? t : m(t, r, n);
|
|
35
35
|
}
|
|
36
|
-
function
|
|
36
|
+
function C(t, r, n = {}) {
|
|
37
37
|
return t.map((e) => {
|
|
38
|
-
if (!e.startsWith(
|
|
38
|
+
if (!e.startsWith(s))
|
|
39
39
|
return e;
|
|
40
|
-
const u =
|
|
41
|
-
return
|
|
40
|
+
const u = T(e);
|
|
41
|
+
return A(g(u, r, n));
|
|
42
42
|
});
|
|
43
43
|
}
|
|
44
|
-
function
|
|
45
|
-
return t.map((e) =>
|
|
44
|
+
function E(t, r, n = {}) {
|
|
45
|
+
return t.map((e) => g(e, r, n));
|
|
46
46
|
}
|
|
47
|
-
function
|
|
48
|
-
const r =
|
|
49
|
-
if (!(r != null && r.startsWith(
|
|
47
|
+
function S(t) {
|
|
48
|
+
const r = a(t, l);
|
|
49
|
+
if (!(r != null && r.startsWith(s)))
|
|
50
50
|
return r;
|
|
51
|
-
const n = "querySelector" in t ? t.querySelector(`[${
|
|
52
|
-
return e ?
|
|
53
|
-
}
|
|
54
|
-
function m(t) {
|
|
55
|
-
return !!(t && "querySelector" in t && t.querySelector(".product-price") && t.querySelector(".product-old-price"));
|
|
56
|
-
}
|
|
57
|
-
function D(t) {
|
|
58
|
-
const r = b(t);
|
|
59
|
-
return r ? m(t) ? [g, d] : [r] : [];
|
|
51
|
+
const n = "querySelector" in t ? t.querySelector(`[${i}]`) : void 0, e = a(n, i);
|
|
52
|
+
return e ? A(e) : r;
|
|
60
53
|
}
|
|
61
|
-
function
|
|
62
|
-
const e =
|
|
63
|
-
return
|
|
54
|
+
function $(t, r, n) {
|
|
55
|
+
const e = a(t, i), u = a(t.querySelector(`[${i}]`), i), c = e ?? u;
|
|
56
|
+
return c === null ? n : c === r;
|
|
64
57
|
}
|
|
65
|
-
function
|
|
66
|
-
const n = (
|
|
67
|
-
`${
|
|
58
|
+
function W(t, r) {
|
|
59
|
+
const n = (h) => t.querySelector(
|
|
60
|
+
`${R}[${l}="${h}"]`
|
|
68
61
|
);
|
|
69
|
-
if (!r.startsWith(
|
|
62
|
+
if (!r.startsWith(s))
|
|
70
63
|
return n(r) ?? null;
|
|
71
|
-
const e =
|
|
72
|
-
if (u &&
|
|
64
|
+
const e = T(r), u = n(r);
|
|
65
|
+
if (u && $(u, e, !0))
|
|
73
66
|
return u;
|
|
74
|
-
const
|
|
75
|
-
return
|
|
67
|
+
const c = A(y(e)), o = c === r ? void 0 : n(c);
|
|
68
|
+
return o && $(o, e, !1) ? o : null;
|
|
76
69
|
}
|
|
77
|
-
function
|
|
78
|
-
const n =
|
|
70
|
+
function q(t, r) {
|
|
71
|
+
const n = T(r), e = A(y(n));
|
|
79
72
|
return e === r ? t : t.replace(
|
|
80
|
-
`${
|
|
81
|
-
`${
|
|
73
|
+
`${l}="${e}"`,
|
|
74
|
+
`${l}="${r}"`
|
|
82
75
|
);
|
|
83
76
|
}
|
|
84
77
|
export {
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
D as resolveRowVisibilityKeys,
|
|
97
|
-
U as rewriteLegacyRowKeyHtml
|
|
78
|
+
y as bareAttributeName,
|
|
79
|
+
T as compositionKeyToProductAttr,
|
|
80
|
+
P as filterToProductAttrValue,
|
|
81
|
+
W as findAttributeRow,
|
|
82
|
+
_ as findFilterByBareName,
|
|
83
|
+
d as isDefaultProductAttr,
|
|
84
|
+
C as normalizeCompositionKeys,
|
|
85
|
+
E as normalizeCustomAttrValues,
|
|
86
|
+
A as productAttrToCompositionKey,
|
|
87
|
+
S as resolveRowCompositionKey,
|
|
88
|
+
q as rewriteLegacyRowKeyHtml
|
|
98
89
|
};
|
|
@@ -189,9 +189,6 @@ export declare class RecommendationCardCompositionControl extends CommonControl
|
|
|
189
189
|
*/
|
|
190
190
|
private _buildCompositionHtml;
|
|
191
191
|
private _applyVisibilityToBlock;
|
|
192
|
-
/** Inline "Product Prices" group row is tagged with whichever price comes first, so it drives both keys. */
|
|
193
|
-
private _resolveVisibilityKeys;
|
|
194
|
-
private _isInlinePrices;
|
|
195
192
|
private _applyTitleVisibilityToBlock;
|
|
196
193
|
private _resolveTitleInjection;
|
|
197
194
|
private _readTitleHtml;
|
|
@@ -33,10 +33,6 @@ export declare function normalizeCustomAttrValues(values: string[], blockNode?:
|
|
|
33
33
|
* value, which stays correct on rows still tagged with a legacy bare name.
|
|
34
34
|
*/
|
|
35
35
|
export declare function resolveRowCompositionKey(row: ImmutableHtmlNode): string | null;
|
|
36
|
-
/** Inline price mode renders sale + original price in ONE row, tagged with whichever comes first. */
|
|
37
|
-
export declare function isMergedInlinePriceRow(row: ImmutableHtmlNode | null | undefined): boolean;
|
|
38
|
-
/** Keys whose visibility a row carries: the merged inline price row stands for both prices. */
|
|
39
|
-
export declare function resolveRowVisibilityKeys(row: ImmutableHtmlNode): string[];
|
|
40
36
|
/**
|
|
41
37
|
* Finds an attribute row by composition key, tolerating rows still tagged with the
|
|
42
38
|
* legacy bare-name key. Custom candidates are validated against their `product-attr`,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@useinsider/guido",
|
|
3
|
-
"version": "3.20.0
|
|
3
|
+
"version": "3.20.0",
|
|
4
4
|
"description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
|
|
5
5
|
"main": "./dist/guido.umd.cjs",
|
|
6
6
|
"module": "./dist/library.js",
|