@useinsider/guido 3.7.0-beta.24bdfa3 → 3.7.0-beta.30ff65e
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/@types/config/schemas.js +66 -70
- package/dist/composables/usePreviewMode.js +14 -15
- package/dist/config/compiler/utils/recommendationCompilerUtils.js +82 -90
- package/dist/config/migrator/recommendation/htmlBuilder.js +58 -59
- package/dist/config/migrator/recommendation/settingsMapper.js +33 -38
- package/dist/extensions/Blocks/Recommendation/block.js +43 -59
- package/dist/extensions/Blocks/Recommendation/constants/defaultConfig.js +32 -41
- package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js +313 -377
- package/dist/extensions/Blocks/Recommendation/controls/main/index.js +72 -84
- package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +66 -68
- package/dist/extensions/Blocks/Recommendation/iconsRegistry.js +7 -21
- package/dist/extensions/Blocks/Recommendation/recommendation.css.js +4 -64
- package/dist/extensions/Blocks/Recommendation/store/recommendation.js +5 -7
- package/dist/extensions/Blocks/Recommendation/templates/grid/elementRenderer.js +72 -101
- package/dist/extensions/Blocks/Recommendation/templates/grid/template.js +30 -31
- package/dist/extensions/Blocks/Recommendation/templates/index.js +7 -9
- package/dist/extensions/Blocks/Recommendation/templates/list/elementRenderer.js +59 -74
- package/dist/extensions/Blocks/Recommendation/templates/list/template.js +21 -21
- package/dist/extensions/Blocks/Recommendation/templates/utils.js +57 -88
- package/dist/src/@types/config/schemas.d.ts +0 -16
- package/dist/src/composables/useConfig.d.ts +0 -4
- package/dist/src/config/migrator/recommendation/settingsMapper.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/block.d.ts +0 -10
- package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts +3 -29
- package/dist/src/extensions/Blocks/Recommendation/controls/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +1 -3
- package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +0 -2
- package/dist/src/extensions/Blocks/Recommendation/templates/grid/elementRenderer.d.ts +0 -16
- package/dist/src/extensions/Blocks/Recommendation/templates/grid/template.d.ts +4 -4
- package/dist/src/extensions/Blocks/Recommendation/templates/list/elementRenderer.d.ts +0 -13
- package/dist/src/extensions/Blocks/Recommendation/templates/list/template.d.ts +2 -3
- package/dist/src/extensions/Blocks/Recommendation/templates/utils.d.ts +1 -33
- package/dist/src/extensions/Blocks/Recommendation/types/nodeConfig.d.ts +0 -15
- package/dist/src/stores/config.d.ts +0 -36
- package/package.json +1 -1
- package/dist/composables/useRecommendationPreview.js +0 -100
- package/dist/extensions/Blocks/Recommendation/controls/main/pricePlacement.js +0 -133
- package/dist/src/composables/useRecommendationPreview.d.ts +0 -10
- package/dist/src/composables/useRecommendationPreview.test.d.ts +0 -1
- package/dist/src/extensions/Blocks/Recommendation/controls/main/pricePlacement.d.ts +0 -59
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import r from "../../../static/assets/info.svg.js";
|
|
2
|
-
import { IconsRegistry as
|
|
3
|
-
class h extends
|
|
4
|
-
registerIconsSvg(
|
|
5
|
-
|
|
2
|
+
import { IconsRegistry as t } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
3
|
+
class h extends t {
|
|
4
|
+
registerIconsSvg(C) {
|
|
5
|
+
C["recommendation-icon"] = `
|
|
6
6
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
|
|
7
7
|
<path d="M10 4.4C10 4.73137 9.73012 4.99622 9.40108 5.0355C6.92202 5.33143 5 7.44126 5 10C5 12.5587
|
|
8
8
|
6.92202 14.6686 9.40108 14.9645C9.73012 15.0038 10 15.2686 10 15.6V18.4C10 18.7314 9.73137 19 9.4
|
|
@@ -44,14 +44,14 @@ class h extends C {
|
|
|
44
44
|
3.40029 12.0082 3.25285 11.7656 3.15234C11.365 2.98638 11.0001 2.64849 11 2.21484V2Z"
|
|
45
45
|
fill="currentColor"/>
|
|
46
46
|
</svg>
|
|
47
|
-
`,
|
|
47
|
+
`, C["grid-orientation"] = `
|
|
48
48
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
|
|
49
49
|
<rect x="1" y="1" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
|
|
50
50
|
<rect x="12" y="1" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
|
|
51
51
|
<rect x="1" y="12" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
|
|
52
52
|
<rect x="12" y="12" width="7" height="7" rx="1" stroke="currentColor" stroke-width="2" fill="none"/>
|
|
53
53
|
</svg>
|
|
54
|
-
`,
|
|
54
|
+
`, C["list-orientation"] = `
|
|
55
55
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
|
|
56
56
|
<circle cx="3" cy="4" r="1" stroke="currentColor" stroke-width="1"/>
|
|
57
57
|
<rect x="7" y="3" width="11" height="2" rx="1"/>
|
|
@@ -60,21 +60,7 @@ class h extends C {
|
|
|
60
60
|
<circle cx="3" cy="16" r="1" stroke="currentColor" stroke-width="1"/>
|
|
61
61
|
<rect x="7" y="15" width="11" height="2" rx="1"/>
|
|
62
62
|
</svg>
|
|
63
|
-
`,
|
|
64
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="currentColor">
|
|
65
|
-
<path d="M19 10V16C19 16.5523 18.5523 17 18 17H2C1.44772 17 1 16.5523 1 16V10H19Z"
|
|
66
|
-
stroke="currentColor" stroke-width="2" fill="none"/>
|
|
67
|
-
<path d="M2 3H18C18.5523 3 19 3.44772 19 4V10H1V4C1 3.44772 1.44772 3 2 3Z" stroke="currentColor"
|
|
68
|
-
stroke-width="2" fill="none"/>
|
|
69
|
-
</svg>
|
|
70
|
-
`, t["horizontal-orientation"] = `
|
|
71
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
|
|
72
|
-
<path d="M10 19H4C3.44772 19 3 18.5523 3 18V2C3 1.44772 3.44772 1 4 1H10V19Z" stroke="currentColor"
|
|
73
|
-
stroke-width="2" fill="none"/>
|
|
74
|
-
<path d="M17 2V18C17 18.5523 16.5523 19 16 19H10V1H16C16.5523 1 17 1.44772 17 2Z" stroke="currentColor"
|
|
75
|
-
stroke-width="2" fill="none"/>
|
|
76
|
-
</svg>
|
|
77
|
-
`, t["migration-info-icon"] = r;
|
|
63
|
+
`, C["migration-info-icon"] = r;
|
|
78
64
|
}
|
|
79
65
|
}
|
|
80
66
|
export {
|
|
@@ -18,13 +18,6 @@ const n = `/* Utils */
|
|
|
18
18
|
padding: 0
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
/* Group the two price-placement rows (orientation + hide-if-same) into one
|
|
22
|
-
container — drop the divider the editor adds between stacked setting rows.
|
|
23
|
-
Ancestor added so this out-specifies the editor's \`.two-columns:not(:first-child)\`. */
|
|
24
|
-
.recommendation-controls-container .price-placement-control-container .container.two-columns {
|
|
25
|
-
border-top: none;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
21
|
/* Right-align the mobile layout toggle within the two-column grid */
|
|
29
22
|
.product-layout-control-container ue-switcher {
|
|
30
23
|
justify-self: end;
|
|
@@ -150,68 +143,15 @@ ue-orderable.orderable-disabled .droppable-icon {
|
|
|
150
143
|
color: var(--guido-color-danger-500);
|
|
151
144
|
}
|
|
152
145
|
|
|
153
|
-
/*
|
|
154
|
-
.orderable-
|
|
155
|
-
|
|
156
|
-
align-items: stretch;
|
|
157
|
-
gap: 8px;
|
|
158
|
-
}
|
|
159
|
-
|
|
160
|
-
.price-group-header {
|
|
161
|
-
display: flex;
|
|
162
|
-
align-items: center;
|
|
163
|
-
gap: 4px;
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
.price-suborderable-list {
|
|
167
|
-
display: flex;
|
|
168
|
-
flex-direction: column;
|
|
169
|
-
margin-left: 4px;
|
|
170
|
-
padding-left: 8px;
|
|
171
|
-
border-left: 2px solid #eee;
|
|
146
|
+
/* Disable drag for list layout */
|
|
147
|
+
.orderable-list.orderable-disabled .drag-handle {
|
|
148
|
+
display: none;
|
|
172
149
|
}
|
|
173
150
|
|
|
174
|
-
.
|
|
175
|
-
display: flex;
|
|
176
|
-
align-items: center;
|
|
177
|
-
gap: 4px;
|
|
178
|
-
padding: 8px 0;
|
|
179
|
-
background: var(--guido-color-white);
|
|
151
|
+
.orderable-list.orderable-disabled .orderable-item {
|
|
180
152
|
cursor: default;
|
|
181
|
-
transition: background 0.15s;
|
|
182
|
-
box-sizing: border-box;
|
|
183
|
-
}
|
|
184
|
-
|
|
185
|
-
.price-suborderable-item:hover {
|
|
186
|
-
background: #fafafa;
|
|
187
|
-
}
|
|
188
|
-
|
|
189
|
-
.price-suborderable-item.dragging {
|
|
190
|
-
opacity: 0.5;
|
|
191
|
-
background: var(--guido-color-gray-1);
|
|
192
|
-
}
|
|
193
|
-
|
|
194
|
-
.price-suborderable-item.drag-over {
|
|
195
|
-
border-top: 2px solid var(--guido-color-primary-500, #0A2ECC);
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
.price-suborderable-item .item-label {
|
|
199
|
-
font-size: 13px;
|
|
200
153
|
}
|
|
201
154
|
|
|
202
|
-
.sub-drag-handle {
|
|
203
|
-
display: flex;
|
|
204
|
-
align-items: center;
|
|
205
|
-
justify-content: center;
|
|
206
|
-
flex-shrink: 0;
|
|
207
|
-
width: 24px;
|
|
208
|
-
height: 24px;
|
|
209
|
-
cursor: move;
|
|
210
|
-
user-select: none;
|
|
211
|
-
color: var(--guido-color-gray-600);
|
|
212
|
-
}
|
|
213
|
-
|
|
214
|
-
|
|
215
155
|
/* ─── Migration Info Box ─────────────────────────────────────────────── */
|
|
216
156
|
/* Shown in the settings panel title when a block was migrated from legacy */
|
|
217
157
|
|
|
@@ -2,8 +2,8 @@ import { getRecommendationFeedSourceMaps as g, getOperatorOptions as R, PriceAtt
|
|
|
2
2
|
import { useRecommendationApi as y } from "../../../../services/recommendationApi.js";
|
|
3
3
|
import { useConfigStore as G } from "../../../../stores/config.js";
|
|
4
4
|
import { defineStore as P } from "pinia";
|
|
5
|
-
import { DEFAULT_CARDS_IN_ROW as
|
|
6
|
-
import { EXCLUDED_ALGORITHM_IDS as
|
|
5
|
+
import { DEFAULT_CARDS_IN_ROW as F } from "../constants/layout.js";
|
|
6
|
+
import { EXCLUDED_ALGORITHM_IDS as D } from "../constants/defaultConfig.js";
|
|
7
7
|
import { getDefaultProducts as S } from "../templates/utils.js";
|
|
8
8
|
import { generateCompleteFilterQuery as b } from "../utils/filterUtil.js";
|
|
9
9
|
import { getPartnerRecommendationParams as v } from "../utils/partnerCustomizations.js";
|
|
@@ -13,7 +13,7 @@ const h = y();
|
|
|
13
13
|
let m = null, u = null, d = null;
|
|
14
14
|
function I() {
|
|
15
15
|
return {
|
|
16
|
-
cardsInRow:
|
|
16
|
+
cardsInRow: F,
|
|
17
17
|
currencySettings: {
|
|
18
18
|
name: "USD",
|
|
19
19
|
value: "USD",
|
|
@@ -36,9 +36,7 @@ function I() {
|
|
|
36
36
|
textTrimming: !0,
|
|
37
37
|
unresponsive: !1,
|
|
38
38
|
size: "6",
|
|
39
|
-
customAttributes: []
|
|
40
|
-
priceMovedToNextLine: !0,
|
|
41
|
-
priceHideIfSameAsDiscounted: !1
|
|
39
|
+
customAttributes: []
|
|
42
40
|
};
|
|
43
41
|
}
|
|
44
42
|
function k() {
|
|
@@ -118,7 +116,7 @@ const x = () => ({
|
|
|
118
116
|
},
|
|
119
117
|
getActivePredictiveAlgorithms: (t) => {
|
|
120
118
|
const e = g(), r = [];
|
|
121
|
-
return t.activePredictiveAlgorithms.filter((n) => !
|
|
119
|
+
return t.activePredictiveAlgorithms.filter((n) => !D.includes(n)).forEach((n) => {
|
|
122
120
|
r.push(...e.filter((c) => c.id === n));
|
|
123
121
|
}), r.map((n) => ({
|
|
124
122
|
text: n.name,
|
|
@@ -1,85 +1,33 @@
|
|
|
1
1
|
import { RecommendationBlockId as l } from "../../constants/blockIds.js";
|
|
2
|
-
import { ATTR_PRODUCT_ATTR as
|
|
3
|
-
import {
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
2
|
+
import { ATTR_PRODUCT_ATTR as u, CSS_CLASS_RECO_BUTTON as p, ATTR_PRODUCT_BUTTON as m, ATTR_PRODUCT_OMNIBUS_DISCOUNT as h, ATTR_PRODUCT_OMNIBUS_PRICE as y, ATTR_PRODUCT_OLD_PRICE as T, ATTR_PRODUCT_PRICE as f, ATTR_PRODUCT_NAME as $, ATTR_PRODUCT_IMAGE as _ } from "../../constants/selectors.js";
|
|
3
|
+
import { useRecommendationExtensionStore as x } from "../../store/recommendation.js";
|
|
4
|
+
import { formatPrice as C } from "../../utils/priceFormatter.js";
|
|
5
|
+
import { CUSTOM_CELL_HTML as R, sanitizeImageUrl as O } from "../utils.js";
|
|
6
|
+
const s = "0 5px", a = "attribute-cell";
|
|
7
|
+
function S(t, e = s) {
|
|
8
|
+
return `<td class="${a}" style="padding: ${e};" width="${t}%"></td>`;
|
|
7
9
|
}
|
|
8
|
-
function
|
|
9
|
-
const
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
class="esd-block-text product-old-price ${n}"
|
|
19
|
-
align="center"
|
|
20
|
-
valign="middle"
|
|
21
|
-
esd-extension-block-id="${l.OLD_PRICE}">
|
|
22
|
-
<p contenteditable="false" style="font-size: 14px; color: #999999;">
|
|
23
|
-
${a}
|
|
24
|
-
</p>
|
|
25
|
-
</td>`, p = e ? o("es-p15l es-p5r") : r("es-p15l es-p5r"), c = e ? r("es-p5l es-p15r") : o("es-p5l es-p15r");
|
|
26
|
-
return `
|
|
27
|
-
<td class="${d}" style="padding: ${s}; height: 100%;" valign="top">
|
|
28
|
-
<table
|
|
29
|
-
class="product-card-segment"
|
|
30
|
-
width="100%"
|
|
31
|
-
height="100%"
|
|
32
|
-
cellpadding="0"
|
|
33
|
-
cellspacing="0"
|
|
34
|
-
border="0">
|
|
35
|
-
<tbody>
|
|
36
|
-
<tr valign="top">
|
|
37
|
-
<td align="center">
|
|
38
|
-
<table cellpadding="0" cellspacing="0" border="0" align="center" style="margin: 0 auto;">
|
|
39
|
-
<tbody>
|
|
40
|
-
<tr valign="middle">
|
|
41
|
-
${p}
|
|
42
|
-
${c}
|
|
43
|
-
</tr>
|
|
44
|
-
</tbody>
|
|
45
|
-
</table>
|
|
46
|
-
</td>
|
|
47
|
-
</tr>
|
|
48
|
-
</tbody>
|
|
49
|
-
</table>
|
|
50
|
-
</td>
|
|
51
|
-
`;
|
|
10
|
+
function g() {
|
|
11
|
+
const t = x(), { currencySettings: e } = t.recommendationConfigs;
|
|
12
|
+
return {
|
|
13
|
+
code: e.value,
|
|
14
|
+
symbol: e.symbol,
|
|
15
|
+
alignment: e.alignment === "0" ? "before" : "after",
|
|
16
|
+
decimalCount: parseInt(e.decimalCount) || 2,
|
|
17
|
+
decimalSeparator: e.decimalSeparator,
|
|
18
|
+
thousandSeparator: e.thousandSeparator
|
|
19
|
+
};
|
|
52
20
|
}
|
|
53
|
-
function
|
|
54
|
-
const
|
|
55
|
-
return
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
width="100%"
|
|
60
|
-
height="100%"
|
|
61
|
-
cellpadding="0"
|
|
62
|
-
cellspacing="0"
|
|
63
|
-
border="0">
|
|
64
|
-
<tbody>
|
|
65
|
-
<tr valign="top">
|
|
66
|
-
<td
|
|
67
|
-
class="esd-block-text product-old-price es-p15l es-p15r"
|
|
68
|
-
align="center"
|
|
69
|
-
esd-extension-block-id="${l.OLD_PRICE}">
|
|
70
|
-
<p contenteditable="false" style="font-size: 14px; color: #999999;">
|
|
71
|
-
${e}
|
|
72
|
-
</p>
|
|
73
|
-
</td>
|
|
74
|
-
</tr>
|
|
75
|
-
</tbody>
|
|
76
|
-
</table>
|
|
77
|
-
</td>
|
|
78
|
-
`;
|
|
21
|
+
function i(t, e = "price") {
|
|
22
|
+
const o = g(), n = t[e], d = (n == null ? void 0 : n[o.code]) ?? Object.values(n ?? {})[0] ?? 0;
|
|
23
|
+
return C({
|
|
24
|
+
price: d,
|
|
25
|
+
currency: o
|
|
26
|
+
});
|
|
79
27
|
}
|
|
80
|
-
const
|
|
81
|
-
[
|
|
82
|
-
<td class="${
|
|
28
|
+
const A = {
|
|
29
|
+
[_]: (t) => `
|
|
30
|
+
<td class="${a}" style="padding: ${s}; height: 100%;" valign="top">
|
|
83
31
|
<table
|
|
84
32
|
class="product-card-segment"
|
|
85
33
|
width="100%"
|
|
@@ -93,9 +41,9 @@ const I = {
|
|
|
93
41
|
class="esd-block-image product-image"
|
|
94
42
|
align="center"
|
|
95
43
|
esd-extension-block-id="${l.IMAGE}">
|
|
96
|
-
<a target="_blank" href="${t.url}" class="${
|
|
44
|
+
<a target="_blank" href="${t.url}" class="${p}">
|
|
97
45
|
<img
|
|
98
|
-
src="${
|
|
46
|
+
src="${O(t.image_url)}"
|
|
99
47
|
alt="${t.name}"
|
|
100
48
|
style="display: block; max-width: 100%; height: auto;"
|
|
101
49
|
class="adapt-img">
|
|
@@ -106,8 +54,8 @@ const I = {
|
|
|
106
54
|
</table>
|
|
107
55
|
</td>
|
|
108
56
|
`,
|
|
109
|
-
[
|
|
110
|
-
<td class="${
|
|
57
|
+
[$]: (t) => `
|
|
58
|
+
<td class="${a}" style="padding: ${s}; height: 100%;" valign="middle">
|
|
111
59
|
<table
|
|
112
60
|
class="product-card-segment"
|
|
113
61
|
width="100%"
|
|
@@ -131,8 +79,8 @@ const I = {
|
|
|
131
79
|
</table>
|
|
132
80
|
</td>
|
|
133
81
|
`,
|
|
134
|
-
[
|
|
135
|
-
<td class="${
|
|
82
|
+
[f]: (t) => `
|
|
83
|
+
<td class="${a}" style="padding: ${s}; height: 100%;" valign="top">
|
|
136
84
|
<table
|
|
137
85
|
class="product-card-segment"
|
|
138
86
|
width="100%"
|
|
@@ -155,9 +103,34 @@ const I = {
|
|
|
155
103
|
</table>
|
|
156
104
|
</td>
|
|
157
105
|
`,
|
|
158
|
-
[
|
|
106
|
+
[T]: (t) => `
|
|
107
|
+
<td class="${a}" style="padding: ${s}; height: 100%;" valign="top">
|
|
108
|
+
<table
|
|
109
|
+
class="product-card-segment"
|
|
110
|
+
width="100%"
|
|
111
|
+
height="100%"
|
|
112
|
+
cellpadding="0"
|
|
113
|
+
cellspacing="0"
|
|
114
|
+
border="0">
|
|
115
|
+
<tbody>
|
|
116
|
+
<tr valign="top">
|
|
117
|
+
<td
|
|
118
|
+
class="esd-block-text product-old-price es-p15l es-p15r"
|
|
119
|
+
align="center"
|
|
120
|
+
esd-extension-block-id="${l.OLD_PRICE}">
|
|
121
|
+
<p
|
|
122
|
+
contenteditable="false"
|
|
123
|
+
style="font-size: 14px; color: #999999;">
|
|
124
|
+
<s><strong>${i(t, "original_price")}</strong></s>
|
|
125
|
+
</p>
|
|
126
|
+
</td>
|
|
127
|
+
</tr>
|
|
128
|
+
</tbody>
|
|
129
|
+
</table>
|
|
130
|
+
</td>
|
|
131
|
+
`,
|
|
159
132
|
[y]: (t) => `
|
|
160
|
-
<td class="${
|
|
133
|
+
<td class="${a}" style="padding: ${s}; height: 100%;" valign="top">
|
|
161
134
|
<table
|
|
162
135
|
class="product-card-segment"
|
|
163
136
|
width="100%"
|
|
@@ -185,10 +158,10 @@ const I = {
|
|
|
185
158
|
</td>
|
|
186
159
|
`,
|
|
187
160
|
[h]: (t) => {
|
|
188
|
-
var
|
|
189
|
-
const e =
|
|
161
|
+
var r, c;
|
|
162
|
+
const e = g(), o = ((r = t.original_price) == null ? void 0 : r[e.code]) ?? Object.values(t.original_price ?? {})[0] ?? 0, n = ((c = t.price) == null ? void 0 : c[e.code]) ?? Object.values(t.price ?? {})[0] ?? 0, d = o > 0 ? Math.round((o - n) / o * 100) : 0, b = d > 0 ? `-${d}%` : "0%";
|
|
190
163
|
return `
|
|
191
|
-
<td class="${
|
|
164
|
+
<td class="${a}" style="padding: ${s}; height: 100%;" valign="top">
|
|
192
165
|
<table
|
|
193
166
|
class="product-card-segment"
|
|
194
167
|
width="100%"
|
|
@@ -206,7 +179,7 @@ const I = {
|
|
|
206
179
|
esd-extension-block-id="${l.OMNIBUS_DISCOUNT}">
|
|
207
180
|
<p contenteditable="false" style="font-size: 12px; color: #666666;">
|
|
208
181
|
<span class="omnibus-text-before"></span>
|
|
209
|
-
<span class="omnibus-discount-value">${
|
|
182
|
+
<span class="omnibus-discount-value">${b}</span>
|
|
210
183
|
<span class="omnibus-text-after"></span>
|
|
211
184
|
</p>
|
|
212
185
|
</td>
|
|
@@ -216,8 +189,8 @@ const I = {
|
|
|
216
189
|
</td>
|
|
217
190
|
`;
|
|
218
191
|
},
|
|
219
|
-
[
|
|
220
|
-
<td class="${
|
|
192
|
+
[m]: () => `
|
|
193
|
+
<td class="${a}" style="padding: ${s}; height: 100%;" valign="top">
|
|
221
194
|
<table
|
|
222
195
|
class="product-card-segment"
|
|
223
196
|
width="100%"
|
|
@@ -240,7 +213,7 @@ const I = {
|
|
|
240
213
|
">
|
|
241
214
|
<a
|
|
242
215
|
href="#"
|
|
243
|
-
class="es-button ${
|
|
216
|
+
class="es-button ${p}"
|
|
244
217
|
target="_blank"
|
|
245
218
|
style="
|
|
246
219
|
color: rgb(56, 118, 29);
|
|
@@ -268,8 +241,8 @@ const I = {
|
|
|
268
241
|
* @param productAttrValue - Resolved product-attr value (e.g., "brand" for default, "product_attribute.rating_star" for custom)
|
|
269
242
|
* @param content - Display content for the cell
|
|
270
243
|
*/
|
|
271
|
-
[
|
|
272
|
-
<td class="${
|
|
244
|
+
[R]: (t, e) => `
|
|
245
|
+
<td class="${a}" style="padding: ${s}; height: 100%;" valign="middle">
|
|
273
246
|
<table
|
|
274
247
|
class="product-card-segment"
|
|
275
248
|
width="100%"
|
|
@@ -281,7 +254,7 @@ const I = {
|
|
|
281
254
|
<tbody>
|
|
282
255
|
<tr valign="top">
|
|
283
256
|
<td
|
|
284
|
-
${
|
|
257
|
+
${u}="${t}"
|
|
285
258
|
class="esd-block-text product-custom-attribute es-p0t es-p0b es-p15l es-p15r"
|
|
286
259
|
align="center"
|
|
287
260
|
esd-extension-block-id="${l.CUSTOM_ATTRIBUTE}">
|
|
@@ -294,10 +267,8 @@ const I = {
|
|
|
294
267
|
`
|
|
295
268
|
};
|
|
296
269
|
export {
|
|
297
|
-
|
|
270
|
+
a as ATTRIBUTE_CELL_CLASS,
|
|
298
271
|
s as DEFAULT_CELL_PADDING,
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
R as renderGridOldPriceCell,
|
|
302
|
-
U as renderInlineGridPriceCell
|
|
272
|
+
S as buildFillerCell,
|
|
273
|
+
A as gridElementRenderer
|
|
303
274
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { DEFAULT_PRODUCTS_PER_ROW as
|
|
2
|
-
import { getDefaultProducts as
|
|
3
|
-
import {
|
|
4
|
-
const
|
|
1
|
+
import { DEFAULT_PRODUCTS_PER_ROW as m } from "../../constants/layout.js";
|
|
2
|
+
import { getDefaultProducts as I, DEFAULTS as b, createBlockTemplate as E, DEFAULT_CARD_COMPOSITION as L, spacer as S, buildElementRenderer as _, DEFAULT_CARD_VISIBILITY as f } from "../utils.js";
|
|
3
|
+
import { buildFillerCell as w, gridElementRenderer as A } from "./elementRenderer.js";
|
|
4
|
+
const D = `
|
|
5
5
|
<tr class="recommendation-product-row">
|
|
6
6
|
<td>
|
|
7
7
|
<table
|
|
@@ -18,7 +18,7 @@ const U = `
|
|
|
18
18
|
</table>
|
|
19
19
|
</td>
|
|
20
20
|
</tr>
|
|
21
|
-
`,
|
|
21
|
+
`, C = `
|
|
22
22
|
<tr
|
|
23
23
|
class="recommendation-attribute-row"
|
|
24
24
|
data-attribute-type="{-{-ATTR_TYPE-}-}"
|
|
@@ -27,39 +27,38 @@ const U = `
|
|
|
27
27
|
{-{-CELLS-}-}
|
|
28
28
|
</tr>
|
|
29
29
|
`;
|
|
30
|
-
function
|
|
31
|
-
const
|
|
32
|
-
return
|
|
33
|
-
const
|
|
34
|
-
return
|
|
30
|
+
function O(t, e, n, r = L, c = {}) {
|
|
31
|
+
const a = (100 / e).toFixed(2), s = e - t.length, l = s > 0 ? w(a).repeat(s) : "", i = _(n, r, c);
|
|
32
|
+
return r.filter((o) => i[o]).map((o) => {
|
|
33
|
+
const p = f[o] ?? !0, u = p ? "" : 'style="display: none;"', T = t.map((R) => i[o](R).replace("<td", `<td width="${a}%"`)).join("");
|
|
34
|
+
return C.replace("{-{-ATTR_TYPE-}-}", o).replace("{-{-VISIBILITY-}-}", p ? "1" : "0").replace("{-{-DISPLAY_STYLE-}-}", u).replace("{-{-CELLS-}-}", T + l);
|
|
35
35
|
}).join("");
|
|
36
36
|
}
|
|
37
|
-
function
|
|
38
|
-
const
|
|
39
|
-
for (let
|
|
40
|
-
|
|
41
|
-
return
|
|
42
|
-
const d =
|
|
37
|
+
function g(t, e, n, r, c = {}) {
|
|
38
|
+
const a = [];
|
|
39
|
+
for (let l = 0; l < t.length; l += e)
|
|
40
|
+
a.push(t.slice(l, l + e));
|
|
41
|
+
return a.map((l, i) => {
|
|
42
|
+
const d = O(
|
|
43
|
+
l,
|
|
44
|
+
e,
|
|
43
45
|
n,
|
|
44
|
-
t,
|
|
45
|
-
o,
|
|
46
46
|
r,
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
return T > 0 ? C + c : c;
|
|
47
|
+
c
|
|
48
|
+
), o = D.replace("{-{-ATTRIBUTE_ROWS-}-}", d);
|
|
49
|
+
return i > 0 ? S + o : o;
|
|
51
50
|
}).join("");
|
|
52
51
|
}
|
|
53
|
-
function
|
|
54
|
-
return
|
|
52
|
+
function P(t, e, n, r = {}) {
|
|
53
|
+
return g(t, e, A, n, r);
|
|
55
54
|
}
|
|
56
|
-
function
|
|
57
|
-
const
|
|
58
|
-
return
|
|
55
|
+
function B(t) {
|
|
56
|
+
const e = t ? `ins-recommendation-v3-block-${t}` : void 0, n = E("grid", e), r = I(), c = P(r, m);
|
|
57
|
+
return n.replace("{-{-TITLE-}-}", b.TITLE).replace("{-{-PRODUCT_ROWS-}-}", c).replace("{-{-MOBILE_PRODUCT_ROWS-}-}", "");
|
|
59
58
|
}
|
|
60
59
|
export {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
60
|
+
B as getDefaultTemplate,
|
|
61
|
+
O as prepareGridAttributeRows,
|
|
62
|
+
g as prepareGridProductRows,
|
|
63
|
+
P as prepareProductRows
|
|
65
64
|
};
|
|
@@ -1,14 +1,12 @@
|
|
|
1
1
|
import { DEFAULT_PRODUCTS_PER_ROW as s } from "../constants/layout.js";
|
|
2
|
-
import { prepareProductRows as
|
|
3
|
-
import { prepareProductRows as
|
|
4
|
-
|
|
5
|
-
function P(o, t, r = {}) {
|
|
6
|
-
const e = { priceInline: r.priceInline };
|
|
2
|
+
import { prepareProductRows as c } from "./grid/template.js";
|
|
3
|
+
import { prepareProductRows as R } from "./list/template.js";
|
|
4
|
+
function a(o, t, r = {}) {
|
|
7
5
|
if (t === "list")
|
|
8
|
-
return
|
|
9
|
-
const { productsPerRow:
|
|
10
|
-
return
|
|
6
|
+
return R(o, r.composition, r.filterList);
|
|
7
|
+
const { productsPerRow: e = s, composition: p, filterList: i } = r;
|
|
8
|
+
return c(o, e, p, i);
|
|
11
9
|
}
|
|
12
10
|
export {
|
|
13
|
-
|
|
11
|
+
a as prepareProductRows
|
|
14
12
|
};
|