@useinsider/guido 3.20.0 → 3.20.1
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/config/compiler/itemsCompilerRules.js +21 -5
- package/dist/config/compiler/utils/itemsCompilerUtils.js +64 -17
- package/dist/config/migrator/itemsBlockMigrator.js +112 -108
- package/dist/extensions/Blocks/Items/block.js +78 -67
- package/dist/extensions/Blocks/Items/constants/cardWidth.js +20 -0
- package/dist/extensions/Blocks/Items/layouts/vertical.html.js +1 -1
- package/dist/extensions/Blocks/Recommendation/block.js +51 -44
- package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js +103 -91
- package/dist/extensions/Blocks/Recommendation/controls/main/index.js +90 -73
- package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +209 -203
- package/dist/extensions/Blocks/Recommendation/store/recommendation.js +122 -90
- package/dist/extensions/Blocks/Recommendation/utils/blockUrlConfig.js +25 -0
- package/dist/extensions/Blocks/Recommendation/utils/captureStyleTemplates.js +72 -70
- package/dist/extensions/Blocks/Recommendation/utils/compositionKeys.js +69 -60
- package/dist/extensions/Blocks/Recommendation/utils/nodeConfigWriter.js +46 -25
- package/dist/extensions/Blocks/Recommendation/utils/strategyCommit.js +40 -17
- package/dist/src/config/compiler/utils/itemsCompilerUtils.d.ts +10 -0
- package/dist/src/extensions/Blocks/Items/block.d.ts +5 -0
- package/dist/src/extensions/Blocks/Items/constants/cardWidth.d.ts +12 -0
- package/dist/src/extensions/Blocks/Recommendation/block.d.ts +2 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts +3 -0
- package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +2 -0
- package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +18 -5
- package/dist/src/extensions/Blocks/Recommendation/utils/blockUrlConfig.d.ts +4 -0
- package/dist/src/extensions/Blocks/Recommendation/utils/compositionKeys.d.ts +4 -0
- package/dist/src/extensions/Blocks/Recommendation/utils/nodeConfigWriter.d.ts +3 -1
- package/dist/src/extensions/Blocks/Recommendation/utils/strategyCommit.d.ts +7 -0
- package/dist/src/utils/liquidProtection.d.ts +3 -0
- package/dist/utils/liquidProtection.js +5 -0
- package/dist/utils/templatePreparation.js +61 -85
- package/package.json +1 -1
|
@@ -9,28 +9,28 @@ import { RECOMMENDATION_ID_ATTR as I } from "../../constants/selectors.js";
|
|
|
9
9
|
import { RecommendationConfigService as c } from "../../services/configService.js";
|
|
10
10
|
import { useRecommendationExtensionStore as R } from "../../store/recommendation.js";
|
|
11
11
|
import { registerNodeConfigWriter as b } from "../../utils/nodeConfigWriter.js";
|
|
12
|
-
import { AlgorithmControl as
|
|
12
|
+
import { AlgorithmControl as P } from "./algorithm.js";
|
|
13
13
|
import { ALGORITHM_CONTROL_ID as ut } from "./algorithm.js";
|
|
14
|
-
import { CurrencyControl as
|
|
14
|
+
import { CurrencyControl as T } from "./currency.js";
|
|
15
15
|
import { CURRENCY_CONTROL_ID as gt } from "./currency.js";
|
|
16
16
|
import { FiltersControl as S } from "./filters.js";
|
|
17
17
|
import { FILTERS_CONTROL_ID as ft } from "./filters.js";
|
|
18
18
|
import { LayoutOrientationControl as O } from "./layoutOrientation.js";
|
|
19
19
|
import { LAYOUT_ORIENTATION_CONTROL_ID as Ct } from "./layoutOrientation.js";
|
|
20
|
-
import { LocaleControl as
|
|
20
|
+
import { LocaleControl as k } from "./locale.js";
|
|
21
21
|
import { LOCALE_CONTROL_ID as yt } from "./locale.js";
|
|
22
|
-
import { PricePlacementControl as
|
|
22
|
+
import { PricePlacementControl as L } from "./pricePlacement.js";
|
|
23
23
|
import { PRICE_PLACEMENT_CONTROL_ID as _t } from "./pricePlacement.js";
|
|
24
24
|
import { ProductCountControl as E } from "./productCount.js";
|
|
25
25
|
import { PRODUCT_COUNT_CONTROL_ID as Rt } from "./productCount.js";
|
|
26
26
|
import { ProductLayoutControl as F } from "./productLayout.js";
|
|
27
|
-
import { PRODUCT_LAYOUT_CONTROL_ID as
|
|
27
|
+
import { PRODUCT_LAYOUT_CONTROL_ID as Pt } from "./productLayout.js";
|
|
28
28
|
import { ShuffleControl as D } from "./shuffle.js";
|
|
29
29
|
import { SHUFFLE_CONTROL_ID as St } from "./shuffle.js";
|
|
30
|
-
import { StrategyControl as
|
|
31
|
-
import { STRATEGY_CONTROL_ID as
|
|
32
|
-
import { setCurrencyAttributes as
|
|
33
|
-
import { adjustProductsToSize as Et, formatProductPrice as Ft, getCardComposition as Dt, getCurrentLayout as
|
|
30
|
+
import { StrategyControl as B } from "./strategy.js";
|
|
31
|
+
import { STRATEGY_CONTROL_ID as kt } from "./strategy.js";
|
|
32
|
+
import { setCurrencyAttributes as w, getBlockElement as v, isPartnerManagedBlock as A, updateProductContentInPlace as x, regenerateProductRowsWithStyles as U } from "./utils.js";
|
|
33
|
+
import { adjustProductsToSize as Et, formatProductPrice as Ft, getCardComposition as Dt, getCurrentLayout as Bt, getMainContainerTbody as wt, regenerateMobileProductRows as vt, updatePricesInPlace as At, updateSingleProductContent as xt } from "./utils.js";
|
|
34
34
|
import { useDebounceFn as f } from "../../../../../node_modules/@vueuse/shared/index.js";
|
|
35
35
|
const W = "ui-elements-recommendation-block";
|
|
36
36
|
class at extends N {
|
|
@@ -77,23 +77,21 @@ class at extends N {
|
|
|
77
77
|
* fails when the size actually changed.
|
|
78
78
|
*/
|
|
79
79
|
i(this, "_debouncedRegenerateWithProducts", f(() => {
|
|
80
|
-
const t = this.store.recommendationProducts;
|
|
81
80
|
if (!this.currentNode || !this.api)
|
|
82
81
|
return;
|
|
83
|
-
const
|
|
84
|
-
if (
|
|
85
|
-
|
|
82
|
+
const t = this._getRecommendationIdFromNode(this.currentNode), e = this.store.currentRecommendationId;
|
|
83
|
+
if (t === null || e === null || t === e || !this.store.blockStates[t]) {
|
|
84
|
+
this._regenerateWithProducts();
|
|
86
85
|
return;
|
|
87
86
|
}
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
});
|
|
87
|
+
if (this.store.blockStates[t].recommendationProducts.length) {
|
|
88
|
+
this.store.setCurrentBlock(t);
|
|
89
|
+
try {
|
|
90
|
+
this._regenerateWithProducts();
|
|
91
|
+
} finally {
|
|
92
|
+
this.store.setCurrentBlock(e);
|
|
93
|
+
}
|
|
94
|
+
}
|
|
97
95
|
}, 100));
|
|
98
96
|
}
|
|
99
97
|
getId() {
|
|
@@ -118,7 +116,7 @@ class at extends N {
|
|
|
118
116
|
return this.rrsEnabled = h().isFeatureEnabled("reusableRecommendationStrategy"), this._subControls.forEach((e) => {
|
|
119
117
|
var o;
|
|
120
118
|
return (o = e == null ? void 0 : e.onDestroy) == null ? void 0 : o.call(e);
|
|
121
|
-
}), this.algorithmControl = new
|
|
119
|
+
}), this.algorithmControl = new P(), this.localeControl = new k(), this.currencyControl = new T(), this.productCountControl = new E(), this.productLayoutControl = new F(), this.filtersControl = new S(), this.shuffleControl = new D(), this.pricePlacementControl = new L(), this.layoutOrientationControl = new O(), this.strategyControl = this.rrsEnabled ? new B() : null, this._subControls.forEach((e) => {
|
|
122
120
|
e && (e.api = this.api);
|
|
123
121
|
}), `
|
|
124
122
|
<div class="recommendation-controls-container">
|
|
@@ -136,12 +134,12 @@ class at extends N {
|
|
|
136
134
|
`;
|
|
137
135
|
}
|
|
138
136
|
_showControlsForBlock(t) {
|
|
139
|
-
var
|
|
140
|
-
const e = (
|
|
137
|
+
var n;
|
|
138
|
+
const e = (n = this.getContainer()) == null ? void 0 : n.querySelector(".recommendation-controls-container");
|
|
141
139
|
if (!e)
|
|
142
140
|
return;
|
|
143
|
-
const o = this._getRecommendationIdFromNode(t) === null ? null : c.getConfig(t),
|
|
144
|
-
e.classList.toggle("strategy-block",
|
|
141
|
+
const o = this._getRecommendationIdFromNode(t) === null ? null : c.getConfig(t), r = this.rrsEnabled && !!o && (!!(o != null && o.strategyId) || ((o == null ? void 0 : o.configVersion) ?? 0) >= _), s = this.rrsEnabled && !!o && !r;
|
|
142
|
+
e.classList.toggle("strategy-block", r), e.classList.toggle("legacy-strategy-block", s);
|
|
145
143
|
}
|
|
146
144
|
async onRender() {
|
|
147
145
|
var o;
|
|
@@ -159,9 +157,9 @@ class at extends N {
|
|
|
159
157
|
const e = this._getRecommendationIdFromNode(t);
|
|
160
158
|
e !== null && e !== this.store.currentRecommendationId && this.store.setCurrentBlock(e), e !== null && this._syncNodeConfigIfChanged(e), this._showControlsForBlock(t), e !== null && !((o = this.store.blockStates[e]) != null && o.isInitialized) && this._fetchBlockData(e).then(() => {
|
|
161
159
|
this._initializeSubControls();
|
|
162
|
-
}), this._subControls.forEach((
|
|
160
|
+
}), this._subControls.forEach((r) => {
|
|
163
161
|
var s;
|
|
164
|
-
|
|
162
|
+
r != null && r.api && (r.currentNode = t, (s = r.onTemplateNodeUpdated) == null || s.call(r, t));
|
|
165
163
|
});
|
|
166
164
|
}
|
|
167
165
|
onDestroy() {
|
|
@@ -209,8 +207,8 @@ class at extends N {
|
|
|
209
207
|
const e = this.store.blockStates[t];
|
|
210
208
|
if (!e)
|
|
211
209
|
return;
|
|
212
|
-
const o = JSON.stringify(c.getConfig(this.currentNode)),
|
|
213
|
-
e.syncedConfigFingerprint = o,
|
|
210
|
+
const o = JSON.stringify(c.getConfig(this.currentNode)), r = e.syncedConfigFingerprint;
|
|
211
|
+
e.syncedConfigFingerprint = o, r !== o && (this.pendingNodeConfigWrite || this._syncNodeConfigToStore());
|
|
214
212
|
}
|
|
215
213
|
/** Whether the deferred write would move the node's strategyId — see the caller (SD-149916). */
|
|
216
214
|
_isPendingStrategyIdChange() {
|
|
@@ -221,16 +219,16 @@ class at extends N {
|
|
|
221
219
|
const t = this.store.currentRecommendationId;
|
|
222
220
|
if (!this.currentNode || !this.api || t === null)
|
|
223
221
|
return;
|
|
224
|
-
const { filters: e, strategy: o, strategyId:
|
|
222
|
+
const { filters: e, strategy: o, strategyId: r, size: s, nodeConfigVersion: n } = this.store.recommendationConfigs, { partnerName: l } = h();
|
|
225
223
|
this.pendingNodeConfigWrite = {
|
|
226
224
|
blockId: t,
|
|
227
225
|
node: this.currentNode,
|
|
228
226
|
updates: {
|
|
229
227
|
filters: e,
|
|
230
228
|
strategy: o,
|
|
231
|
-
strategyId:
|
|
229
|
+
strategyId: r,
|
|
232
230
|
size: s,
|
|
233
|
-
configVersion:
|
|
231
|
+
configVersion: n,
|
|
234
232
|
...l.value ? { partnerName: l.value } : {}
|
|
235
233
|
}
|
|
236
234
|
};
|
|
@@ -275,8 +273,8 @@ class at extends N {
|
|
|
275
273
|
JSON.stringify(o.filters) === JSON.stringify(t.updates.filters) && o.strategy === t.updates.strategy && o.strategyId === t.updates.strategyId && o.size === t.updates.size || c.updateConfig(this.api, e, t.updates, "Update recommendation filters");
|
|
276
274
|
}
|
|
277
275
|
_syncNodeConfigToStore() {
|
|
278
|
-
var
|
|
279
|
-
const t = c.getConfig(this.currentNode), e = this.store.currentRecommendationId, o = e !== null && ((
|
|
276
|
+
var r;
|
|
277
|
+
const t = c.getConfig(this.currentNode), e = this.store.currentRecommendationId, o = e !== null && ((r = this.store.blockStates[e]) == null ? void 0 : r.isInitialized);
|
|
280
278
|
this.store.patchCurrentBlockConfig({
|
|
281
279
|
strategy: t.strategy,
|
|
282
280
|
strategyId: t.strategyId,
|
|
@@ -319,8 +317,8 @@ class at extends N {
|
|
|
319
317
|
t !== null && this.store.markBlockInitialized(t), (await Promise.allSettled([
|
|
320
318
|
this.store.fetchRecommendationCreateData(),
|
|
321
319
|
this.store.fetchRecommendationFilters()
|
|
322
|
-
])).forEach((o,
|
|
323
|
-
o.status === "rejected" && console.warn(`Recommendation block: ${["fetchRecommendationCreateData", "fetchRecommendationFilters"][
|
|
320
|
+
])).forEach((o, r) => {
|
|
321
|
+
o.status === "rejected" && console.warn(`Recommendation block: ${["fetchRecommendationCreateData", "fetchRecommendationFilters"][r]} failed`, o.reason);
|
|
324
322
|
}), this._applySmartDefaults();
|
|
325
323
|
try {
|
|
326
324
|
await this.store.fetchRecommendationProducts();
|
|
@@ -342,35 +340,35 @@ class at extends N {
|
|
|
342
340
|
if (!this.currentNode || !this.api)
|
|
343
341
|
return;
|
|
344
342
|
const t = c.getConfig(this.currentNode), e = {};
|
|
345
|
-
let o = null,
|
|
343
|
+
let o = null, r = null, s = null;
|
|
346
344
|
if (t.currency.code === a.currency.code) {
|
|
347
|
-
const { currencyList:
|
|
348
|
-
|
|
345
|
+
const { currencyList: n } = this.store;
|
|
346
|
+
n.length > 0 && (n.some(
|
|
349
347
|
(d) => d.value === `price.${a.currency.code}`
|
|
350
|
-
) || (o =
|
|
348
|
+
) || (o = n[0].value.replace("price.", ""), e.currency = {
|
|
351
349
|
...a.currency,
|
|
352
350
|
code: o,
|
|
353
351
|
symbol: o
|
|
354
352
|
}));
|
|
355
353
|
}
|
|
356
354
|
if (t.strategy === a.strategy) {
|
|
357
|
-
const
|
|
358
|
-
|
|
355
|
+
const n = this.store.getActivePredictiveAlgorithms;
|
|
356
|
+
n.length > 0 && (n.some(
|
|
359
357
|
(d) => d.value === a.strategy
|
|
360
|
-
) || (
|
|
358
|
+
) || (r = n[0].value, e.strategy = r));
|
|
361
359
|
}
|
|
362
360
|
if (t.language === a.language) {
|
|
363
|
-
const
|
|
364
|
-
|
|
361
|
+
const n = this.store.getLanguages;
|
|
362
|
+
n.length > 0 && (n.some(
|
|
365
363
|
(d) => d.value === a.language
|
|
366
|
-
) || (s =
|
|
364
|
+
) || (s = n[0].value, e.language = s));
|
|
367
365
|
}
|
|
368
|
-
!o && !
|
|
366
|
+
!o && !r && !s || (c.updateConfig(
|
|
369
367
|
this.api,
|
|
370
368
|
this.currentNode,
|
|
371
369
|
e,
|
|
372
370
|
"Applied smart defaults"
|
|
373
|
-
), o && e.currency &&
|
|
371
|
+
), o && e.currency && w({
|
|
374
372
|
currentNode: this.currentNode,
|
|
375
373
|
documentModifier: this.api.getDocumentModifier(),
|
|
376
374
|
currency: e.currency
|
|
@@ -386,7 +384,7 @@ class at extends N {
|
|
|
386
384
|
thousandSeparator: a.currency.thousandSeparator
|
|
387
385
|
}
|
|
388
386
|
} : {},
|
|
389
|
-
...
|
|
387
|
+
...r ? { strategy: r } : {},
|
|
390
388
|
...s ? { language: s } : {}
|
|
391
389
|
}, { triggerRefetch: !1 }));
|
|
392
390
|
}
|
|
@@ -394,14 +392,33 @@ class at extends N {
|
|
|
394
392
|
* Reads the recommendation-id attribute from the block element within the node
|
|
395
393
|
*/
|
|
396
394
|
_getRecommendationIdFromNode(t) {
|
|
397
|
-
const e =
|
|
395
|
+
const e = v(t);
|
|
398
396
|
if (!e || !("getAttribute" in e))
|
|
399
397
|
return null;
|
|
400
398
|
const o = e.getAttribute(I);
|
|
401
399
|
if (!o)
|
|
402
400
|
return null;
|
|
403
|
-
const
|
|
404
|
-
return Number.isNaN(
|
|
401
|
+
const r = parseInt(o);
|
|
402
|
+
return Number.isNaN(r) ? null : r;
|
|
403
|
+
}
|
|
404
|
+
/** Draws the current block's products into this panel's node. */
|
|
405
|
+
_regenerateWithProducts() {
|
|
406
|
+
if (!this.currentNode || !this.api)
|
|
407
|
+
return;
|
|
408
|
+
const t = this.store.recommendationProducts, e = this.api.getDocumentModifier(), o = this._stagePendingNodeConfig(e);
|
|
409
|
+
if (A(this.currentNode)) {
|
|
410
|
+
o && (e.apply(new y("Update recommendation configuration")), this.pendingNodeConfigWrite = null, this._clearConfigFlush());
|
|
411
|
+
return;
|
|
412
|
+
}
|
|
413
|
+
x({
|
|
414
|
+
currentNode: this.currentNode,
|
|
415
|
+
documentModifier: e,
|
|
416
|
+
products: t
|
|
417
|
+
}) || U({
|
|
418
|
+
currentNode: this.currentNode,
|
|
419
|
+
documentModifier: e,
|
|
420
|
+
products: t
|
|
421
|
+
});
|
|
405
422
|
}
|
|
406
423
|
/**
|
|
407
424
|
* Listen to store changes that require product refresh or regeneration.
|
|
@@ -418,15 +435,15 @@ class at extends N {
|
|
|
418
435
|
*/
|
|
419
436
|
_listenStateUpdates() {
|
|
420
437
|
const { store: t } = this;
|
|
421
|
-
let e = t.recommendationProducts, o = t.$state.configVersion,
|
|
438
|
+
let e = t.recommendationProducts, o = t.$state.configVersion, r = t.currentRecommendationId;
|
|
422
439
|
this.storeUnsubscription = t.$subscribe(() => {
|
|
423
440
|
const s = t.currentRecommendationId;
|
|
424
|
-
if (s !==
|
|
425
|
-
|
|
441
|
+
if (s !== r) {
|
|
442
|
+
r = s, e = t.recommendationProducts, o = t.$state.configVersion;
|
|
426
443
|
return;
|
|
427
444
|
}
|
|
428
|
-
const
|
|
429
|
-
|
|
445
|
+
const n = t.$state.configVersion;
|
|
446
|
+
n !== o && (o = n, this._capturePendingNodeConfigWrite(), this._isPendingStrategyIdChange() && this._flushPendingNodeConfig(), this._debouncedFetchProducts());
|
|
430
447
|
const l = t.recommendationProducts, d = l !== e, m = Array.isArray(l) && l.length > 0;
|
|
431
448
|
d && m && (e = l, this._debouncedRegenerateWithProducts());
|
|
432
449
|
});
|
|
@@ -434,38 +451,38 @@ class at extends N {
|
|
|
434
451
|
}
|
|
435
452
|
export {
|
|
436
453
|
ut as ALGORITHM_CONTROL_ID,
|
|
437
|
-
|
|
454
|
+
P as AlgorithmControl,
|
|
438
455
|
W as CONTROL_BLOCK_ID,
|
|
439
456
|
gt as CURRENCY_CONTROL_ID,
|
|
440
|
-
|
|
457
|
+
T as CurrencyControl,
|
|
441
458
|
ft as FILTERS_CONTROL_ID,
|
|
442
459
|
S as FiltersControl,
|
|
443
460
|
Ct as LAYOUT_ORIENTATION_CONTROL_ID,
|
|
444
461
|
yt as LOCALE_CONTROL_ID,
|
|
445
462
|
O as LayoutOrientationControl,
|
|
446
|
-
|
|
463
|
+
k as LocaleControl,
|
|
447
464
|
_t as PRICE_PLACEMENT_CONTROL_ID,
|
|
448
465
|
Rt as PRODUCT_COUNT_CONTROL_ID,
|
|
449
|
-
|
|
450
|
-
|
|
466
|
+
Pt as PRODUCT_LAYOUT_CONTROL_ID,
|
|
467
|
+
L as PricePlacementControl,
|
|
451
468
|
E as ProductCountControl,
|
|
452
469
|
F as ProductLayoutControl,
|
|
453
470
|
at as RecommendationBlockControl,
|
|
454
471
|
St as SHUFFLE_CONTROL_ID,
|
|
455
|
-
|
|
472
|
+
kt as STRATEGY_CONTROL_ID,
|
|
456
473
|
D as ShuffleControl,
|
|
457
|
-
|
|
474
|
+
B as StrategyControl,
|
|
458
475
|
Et as adjustProductsToSize,
|
|
459
476
|
Ft as formatProductPrice,
|
|
460
|
-
|
|
477
|
+
v as getBlockElement,
|
|
461
478
|
Dt as getCardComposition,
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
479
|
+
Bt as getCurrentLayout,
|
|
480
|
+
wt as getMainContainerTbody,
|
|
481
|
+
A as isPartnerManagedBlock,
|
|
482
|
+
vt as regenerateMobileProductRows,
|
|
466
483
|
U as regenerateProductRowsWithStyles,
|
|
467
|
-
|
|
468
|
-
|
|
484
|
+
w as setCurrencyAttributes,
|
|
485
|
+
At as updatePricesInPlace,
|
|
469
486
|
x as updateProductContentInPlace,
|
|
470
487
|
xt as updateSingleProductContent
|
|
471
488
|
};
|