@useinsider/guido 3.7.2-beta.0bf502c → 3.7.2-beta.13c9a35

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.
Files changed (41) hide show
  1. package/dist/@types/config/schemas.js +70 -66
  2. package/dist/composables/usePreviewMode.js +15 -14
  3. package/dist/composables/useRecommendationPreview.js +100 -0
  4. package/dist/composables/useStripo.js +54 -68
  5. package/dist/config/compiler/utils/recommendationCompilerUtils.js +90 -82
  6. package/dist/config/i18n/en/toasters.json.js +0 -1
  7. package/dist/config/migrator/recommendation/htmlBuilder.js +59 -58
  8. package/dist/config/migrator/recommendation/settingsMapper.js +38 -33
  9. package/dist/extensions/Blocks/Recommendation/block.js +60 -41
  10. package/dist/extensions/Blocks/Recommendation/constants/defaultConfig.js +41 -32
  11. package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js +369 -288
  12. package/dist/extensions/Blocks/Recommendation/controls/main/index.js +96 -84
  13. package/dist/extensions/Blocks/Recommendation/controls/main/pricePlacement.js +133 -0
  14. package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +82 -80
  15. package/dist/extensions/Blocks/Recommendation/iconsRegistry.js +21 -7
  16. package/dist/extensions/Blocks/Recommendation/recommendation.css.js +64 -4
  17. package/dist/extensions/Blocks/Recommendation/store/recommendation.js +7 -5
  18. package/dist/extensions/Blocks/Recommendation/templates/grid/elementRenderer.js +101 -72
  19. package/dist/extensions/Blocks/Recommendation/templates/grid/template.js +31 -30
  20. package/dist/extensions/Blocks/Recommendation/templates/index.js +9 -7
  21. package/dist/extensions/Blocks/Recommendation/templates/list/elementRenderer.js +74 -59
  22. package/dist/extensions/Blocks/Recommendation/templates/list/template.js +21 -21
  23. package/dist/extensions/Blocks/Recommendation/templates/utils.js +88 -57
  24. package/dist/src/@types/config/schemas.d.ts +16 -0
  25. package/dist/src/composables/useConfig.d.ts +4 -0
  26. package/dist/src/composables/useRecommendationPreview.d.ts +10 -0
  27. package/dist/src/config/migrator/recommendation/settingsMapper.d.ts +1 -1
  28. package/dist/src/extensions/Blocks/Recommendation/block.d.ts +10 -0
  29. package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts +29 -3
  30. package/dist/src/extensions/Blocks/Recommendation/controls/index.d.ts +1 -1
  31. package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +3 -1
  32. package/dist/src/extensions/Blocks/Recommendation/controls/main/pricePlacement.d.ts +59 -0
  33. package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +2 -0
  34. package/dist/src/extensions/Blocks/Recommendation/templates/grid/elementRenderer.d.ts +16 -0
  35. package/dist/src/extensions/Blocks/Recommendation/templates/grid/template.d.ts +4 -4
  36. package/dist/src/extensions/Blocks/Recommendation/templates/list/elementRenderer.d.ts +13 -0
  37. package/dist/src/extensions/Blocks/Recommendation/templates/list/template.d.ts +3 -2
  38. package/dist/src/extensions/Blocks/Recommendation/templates/utils.d.ts +33 -1
  39. package/dist/src/extensions/Blocks/Recommendation/types/nodeConfig.d.ts +15 -0
  40. package/dist/src/stores/config.d.ts +36 -0
  41. package/package.json +1 -1
@@ -1,74 +1,74 @@
1
1
  import { ModificationDescription as p } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
2
  import { RecommendationBlockId as m } from "../../constants/blockIds.js";
3
- import { CURRENCY_ATTR as g, MOBILE_CONTAINER_SELECTOR as q, MOBILE_ROW_SELECTOR as k, DESKTOP_CONTAINER_SELECTOR as P, CONTAINER_SELECTOR as v, ATTR_PRODUCT_ATTR as j } from "../../constants/selectors.js";
3
+ import { CURRENCY_ATTR as g, MOBILE_CONTAINER_SELECTOR as q, MOBILE_ROW_SELECTOR as k, DESKTOP_CONTAINER_SELECTOR as P, CONTAINER_SELECTOR as j, ATTR_PRODUCT_ATTR as V } from "../../constants/selectors.js";
4
4
  import { RecommendationConfigService as b } from "../../services/configService.js";
5
5
  import { useRecommendationExtensionStore as C } from "../../store/recommendation.js";
6
- import { prepareProductRows as _ } from "../../templates/index.js";
7
- import { formatPrice as V } from "../../utils/priceFormatter.js";
8
- import { isTdNode as W } from "../../utils/tagName.js";
9
- import { getDefaultProducts as L, DEFAULT_CARD_COMPOSITION as T, sanitizeImageUrl as F, toDisplayableAttributeValue as G } from "../../templates/utils.js";
10
- const h = "recommendation-block-v2";
11
- function R(t) {
6
+ import { prepareProductRows as L } from "../../templates/index.js";
7
+ import { formatPrice as W } from "../../utils/priceFormatter.js";
8
+ import { isTdNode as F } from "../../utils/tagName.js";
9
+ import { getDefaultProducts as _, DEFAULT_CARD_COMPOSITION as M, sanitizeImageUrl as G, toDisplayableAttributeValue as Y } from "../../templates/utils.js";
10
+ const R = "recommendation-block-v2";
11
+ function T(t) {
12
12
  if (!t)
13
13
  return null;
14
14
  if ("getAttribute" in t) {
15
15
  const e = t.getAttribute("class");
16
- if (e && e.includes(h))
16
+ if (e && e.includes(R))
17
17
  return t;
18
18
  }
19
- return "querySelector" in t ? t.querySelector(`.${h}`) ?? null : null;
19
+ return "querySelector" in t ? t.querySelector(`.${R}`) ?? null : null;
20
20
  }
21
21
  function E(t) {
22
- const e = R(t);
22
+ const e = T(t);
23
23
  if (!e || !("getAttribute" in e))
24
24
  return "grid";
25
25
  const o = e.getAttribute("data-layout");
26
26
  return o === "list" || o === "horizontal" ? "list" : "grid";
27
27
  }
28
- function H(t) {
29
- const e = R(t);
28
+ function x(t) {
29
+ const e = T(t);
30
30
  if (!e || !("getAttribute" in e))
31
- return T;
31
+ return M;
32
32
  const o = e.getAttribute("data-card-composition");
33
- return o ? o.split(",").filter(Boolean) : T;
33
+ return o ? o.split(",").filter(Boolean) : M;
34
34
  }
35
- function x(t) {
35
+ function H(t) {
36
36
  if (!t || !("childNodes" in t))
37
37
  return null;
38
38
  const e = t.childNodes(), o = e.find(
39
39
  (n) => "getType" in n && n.getType() === "text"
40
40
  );
41
- return o || e.reduce((n, r) => n || !("getType" in r) || r.getType() === "text" ? n : x(r), null);
41
+ return o || e.reduce((n, r) => n || !("getType" in r) || r.getType() === "text" ? n : H(r), null);
42
42
  }
43
43
  function S(t, e, o) {
44
- const n = x(e);
44
+ const n = H(e);
45
45
  return n ? (t.modifyHtml(n).setText(o), !0) : !1;
46
46
  }
47
47
  function D(t, e) {
48
- return t && t.length > 0 ? t : e.length > 0 ? e : L();
48
+ return t && t.length > 0 ? t : e.length > 0 ? e : _();
49
49
  }
50
- function Y(t) {
50
+ function K(t) {
51
51
  const { currentNode: e, documentModifier: o } = t;
52
52
  if (!e || !("querySelector" in e))
53
53
  return;
54
54
  const n = e.querySelector(k);
55
55
  n && (o.modifyHtml(n).setInnerHtml(""), o.apply(new p("Cleared mobile row content")));
56
56
  }
57
- function K(t) {
57
+ function X(t) {
58
58
  return "getOuterHTML" in t && typeof t.getOuterHTML == "function" ? t.getOuterHTML() : "";
59
59
  }
60
- function X(t) {
60
+ function z(t) {
61
61
  const e = t.querySelector(".container");
62
62
  return !e || !("childNodes" in e) ? null : e.childNodes().find((n) => "getTagName" in n && n.getTagName() === "tbody") ?? e.querySelector("tbody") ?? null;
63
63
  }
64
- function z(t, e, o) {
65
- const n = X(t);
64
+ function J(t, e, o) {
65
+ const n = z(t);
66
66
  if (!n || !("childNodes" in n))
67
67
  return;
68
- const r = n.childNodes().map(K).join(""), l = `<tr class="ins-recommendation-mobile-row">${o}</tr>`;
68
+ const r = n.childNodes().map(X).join(""), l = `<tr class="ins-recommendation-mobile-row">${o}</tr>`;
69
69
  e.modifyHtml(n).setInnerHtml(r + l), e.apply(new p("Added mobile product row"));
70
70
  }
71
- function J(t) {
71
+ function Q(t) {
72
72
  const {
73
73
  currentNode: e,
74
74
  documentModifier: o,
@@ -80,21 +80,22 @@ function J(t) {
80
80
  return;
81
81
  const i = r ?? E(e), s = b.getConfig(e);
82
82
  if (i === "list" || !s.mobileLayoutEnabled) {
83
- Y({ currentNode: e, documentModifier: o });
83
+ K({ currentNode: e, documentModifier: o });
84
84
  return;
85
85
  }
86
- const u = C(), c = D(n, u.recommendationProducts), d = l ?? H(e), a = `<td><table class="ins-recommendation-product-container ins-recommendation-mobile-container" width="100%" cellpadding="0" cellspacing="0" border="0">${_(c, i, {
86
+ const u = C(), c = D(n, u.recommendationProducts), d = l ?? x(e), a = `<td><table class="ins-recommendation-product-container ins-recommendation-mobile-container" width="100%" cellpadding="0" cellspacing="0" border="0">${L(c, i, {
87
87
  productsPerRow: s.mobileCardsInRow,
88
88
  composition: d,
89
- filterList: u.filterList
89
+ filterList: u.filterList,
90
+ priceInline: !s.priceMovedToNextLine
90
91
  })}</table></td>`, y = e.querySelector(k);
91
92
  if (!y) {
92
- z(e, o, a);
93
+ J(e, o, a);
93
94
  return;
94
95
  }
95
96
  o.modifyHtml(y).setInnerHtml(a), o.apply(new p("Updated mobile product rows"));
96
97
  }
97
- function Q(t) {
98
+ function Z(t) {
98
99
  const {
99
100
  currentNode: e,
100
101
  documentModifier: o,
@@ -105,17 +106,18 @@ function Q(t) {
105
106
  } = t;
106
107
  if (!e || !("querySelector" in e))
107
108
  return;
108
- const s = e.querySelector(P) ?? e.querySelector(v);
109
+ const s = e.querySelector(P) ?? e.querySelector(j);
109
110
  if (!s)
110
111
  return;
111
- const u = C(), c = D(r, u.recommendationProducts), { cardsInRow: d } = b.getConfig(e), f = i ?? H(e), a = l ?? E(e), y = _(c, a, {
112
+ const u = C(), c = D(r, u.recommendationProducts), { cardsInRow: d } = b.getConfig(e), f = i ?? x(e), a = l ?? E(e), { priceMovedToNextLine: y } = b.getConfig(e), v = L(c, a, {
112
113
  productsPerRow: d,
113
114
  composition: f,
114
- filterList: u.filterList
115
+ filterList: u.filterList,
116
+ priceInline: !y
115
117
  });
116
- o.modifyHtml(s).setInnerHtml(y).apply(new p("Updated product")), J(t), n == null || n();
118
+ o.modifyHtml(s).setInnerHtml(v).apply(new p("Updated product")), Q(t), n == null || n();
117
119
  }
118
- function M(t, e, o, n) {
120
+ function h(t, e, o, n) {
119
121
  const l = `0 ${Math.floor(o / 2)}px`;
120
122
  let i = !1;
121
123
  return n === "grid" ? Array.from(
@@ -126,7 +128,7 @@ function M(t, e, o, n) {
126
128
  t.querySelectorAll(".product-card-wrapper")
127
129
  ).forEach((u) => {
128
130
  const c = "parentNode" in u ? u.parentNode : null;
129
- c && W(c) && (e.modifyHtml(c).setStyle("padding", l), i = !0);
131
+ c && F(c) && (e.modifyHtml(c).setStyle("padding", l), i = !0);
130
132
  }), i;
131
133
  }
132
134
  function I(t, e, o) {
@@ -136,7 +138,7 @@ function I(t, e, o) {
136
138
  e.modifyHtml(i).setStyle("height", n), l = !0;
137
139
  }), l;
138
140
  }
139
- function Z(t) {
141
+ function ee(t) {
140
142
  const { currentNode: e, documentModifier: o } = t;
141
143
  if (!e)
142
144
  return;
@@ -144,7 +146,7 @@ function Z(t) {
144
146
  let l = !1;
145
147
  const i = e.querySelector(P);
146
148
  if (i) {
147
- l = M(
149
+ l = h(
148
150
  i,
149
151
  o,
150
152
  n.columnSpacing,
@@ -159,7 +161,7 @@ function Z(t) {
159
161
  }
160
162
  const s = e.querySelector(q);
161
163
  if (s) {
162
- const u = M(
164
+ const u = h(
163
165
  s,
164
166
  o,
165
167
  n.mobileColumnSpacing,
@@ -175,9 +177,9 @@ function Z(t) {
175
177
  }
176
178
  l && o.apply(new p("Reapply spacing after regeneration"));
177
179
  }
178
- function me(t) {
180
+ function pe(t) {
179
181
  const { currentNode: e, documentModifier: o, afterRegenerate: n, products: r, layout: l, composition: i } = t;
180
- e && Q({
182
+ e && Z({
181
183
  currentNode: e,
182
184
  documentModifier: o,
183
185
  products: r,
@@ -185,13 +187,13 @@ function me(t) {
185
187
  composition: i,
186
188
  afterRegenerate: () => {
187
189
  setTimeout(() => {
188
- Z({ currentNode: e, documentModifier: o });
190
+ ee({ currentNode: e, documentModifier: o });
189
191
  }, 0), n == null || n();
190
192
  }
191
193
  });
192
194
  }
193
- function pe(t, e) {
194
- return t.length === e ? t : t.length > e ? t.slice(0, e) : [...t, ...L(e - t.length)];
195
+ function ye(t, e) {
196
+ return t.length === e ? t : t.length > e ? t.slice(0, e) : [...t, ..._(e - t.length)];
195
197
  }
196
198
  function U() {
197
199
  const t = C(), { currencySettings: e } = t.recommendationConfigs, o = parseInt(e.decimalCount);
@@ -206,12 +208,12 @@ function U() {
206
208
  }
207
209
  function A(t, e = "price") {
208
210
  const o = U(), n = t[e], r = (n == null ? void 0 : n[o.code]) ?? Object.values(n ?? {})[0] ?? 0;
209
- return V({
211
+ return W({
210
212
  price: r,
211
213
  currency: o
212
214
  });
213
215
  }
214
- function ee(t) {
216
+ function te(t) {
215
217
  var l, i;
216
218
  const e = U(), o = ((l = t.original_price) == null ? void 0 : l[e.code]) ?? Object.values(t.original_price ?? {})[0] ?? 0, n = ((i = t.price) == null ? void 0 : i[e.code]) ?? Object.values(t.price ?? {})[0] ?? 0, r = o > 0 ? Math.round((o - n) / o * 100) : 0;
217
219
  return r > 0 ? `-${r}%` : "0%";
@@ -232,12 +234,12 @@ function $(t) {
232
234
  S(e, u, c) && (s = !0);
233
235
  }
234
236
  if (i && "querySelector" in i) {
235
- const u = i.querySelector(".omnibus-discount-value") ?? null, c = ee(o);
237
+ const u = i.querySelector(".omnibus-discount-value") ?? null, c = te(o);
236
238
  S(e, u, c) && (s = !0);
237
239
  }
238
240
  return s;
239
241
  }
240
- function te(t) {
242
+ function oe(t) {
241
243
  const {
242
244
  documentModifier: e,
243
245
  product: o,
@@ -252,7 +254,7 @@ function te(t) {
252
254
  let d = !1;
253
255
  if (n && "querySelector" in n) {
254
256
  const f = n.querySelector("img");
255
- f && (e.modifyHtml(f).setAttribute("src", F(o.image_url)).setAttribute("alt", o.name), d = !0);
257
+ f && (e.modifyHtml(f).setAttribute("src", G(o.image_url)).setAttribute("alt", o.name), d = !0);
256
258
  const a = n.querySelector("a");
257
259
  a && (e.modifyHtml(a).setAttribute("href", o.url), d = !0);
258
260
  }
@@ -276,18 +278,18 @@ function te(t) {
276
278
  function B(t) {
277
279
  return "querySelector" in t ? t.querySelector(P) ?? t : t;
278
280
  }
279
- const O = "product_attribute.";
280
- function oe(t, e) {
281
+ const N = "product_attribute.";
282
+ function ne(t, e) {
281
283
  var n;
282
284
  let o;
283
- if (t.startsWith(O)) {
284
- const r = t.slice(O.length);
285
+ if (t.startsWith(N)) {
286
+ const r = t.slice(N.length);
285
287
  o = (n = e.product_attributes) == null ? void 0 : n[r];
286
288
  } else
287
289
  o = e[t];
288
- return G(o) || null;
290
+ return Y(o) || null;
289
291
  }
290
- function ne(t, e, o) {
292
+ function re(t, e, o) {
291
293
  if (!("querySelectorAll" in t))
292
294
  return !1;
293
295
  const n = t.querySelectorAll(
@@ -299,7 +301,7 @@ function ne(t, e, o) {
299
301
  n.forEach((i) => {
300
302
  if (!("getAttribute" in i))
301
303
  return;
302
- const s = i.getAttribute(j);
304
+ const s = i.getAttribute(V);
303
305
  if (!s)
304
306
  return;
305
307
  const u = r.get(s) ?? [];
@@ -311,7 +313,7 @@ function ne(t, e, o) {
311
313
  i.slice(0, u).forEach((c, d) => {
312
314
  if (!("querySelector" in c))
313
315
  return;
314
- const f = oe(s, o[d]);
316
+ const f = ne(s, o[d]);
315
317
  if (f === null)
316
318
  return;
317
319
  const a = c.querySelector("p") ?? null;
@@ -319,7 +321,7 @@ function ne(t, e, o) {
319
321
  });
320
322
  }), l;
321
323
  }
322
- function w(t, e, o) {
324
+ function O(t, e, o) {
323
325
  if (!("querySelectorAll" in t))
324
326
  return !1;
325
327
  const n = t.querySelectorAll(
@@ -339,7 +341,7 @@ function w(t, e, o) {
339
341
  ), d = Math.min(n.length, o.length);
340
342
  let f = !1;
341
343
  for (let a = 0; a < d; a++) {
342
- const y = te({
344
+ const y = oe({
343
345
  documentModifier: e,
344
346
  product: o[a],
345
347
  imageEl: n[a] ?? null,
@@ -352,9 +354,9 @@ function w(t, e, o) {
352
354
  });
353
355
  f = f || y;
354
356
  }
355
- return ne(t, e, o) && (f = !0), f;
357
+ return re(t, e, o) && (f = !0), f;
356
358
  }
357
- function ye(t) {
359
+ function ge(t) {
358
360
  const { currentNode: e, documentModifier: o, products: n } = t;
359
361
  if (!e || !("querySelectorAll" in e))
360
362
  return !1;
@@ -363,12 +365,12 @@ function ye(t) {
363
365
  `[esd-extension-block-id="${m.IMAGE}"]`
364
366
  ).length !== n.length)
365
367
  return !1;
366
- let i = w(r, o, n);
368
+ let i = O(r, o, n);
367
369
  const s = E(e), u = b.getConfig(e);
368
370
  if (s !== "list" && u.mobileLayoutEnabled && "querySelector" in e) {
369
371
  const c = e.querySelector(q);
370
372
  if (c) {
371
- const d = w(
373
+ const d = O(
372
374
  c,
373
375
  o,
374
376
  n
@@ -378,7 +380,7 @@ function ye(t) {
378
380
  }
379
381
  return i && o.apply(new p("Updated product content in-place")), !0;
380
382
  }
381
- function N(t, e, o) {
383
+ function w(t, e, o) {
382
384
  if (!("querySelectorAll" in t))
383
385
  return !1;
384
386
  const n = t.querySelectorAll(
@@ -402,7 +404,7 @@ function N(t, e, o) {
402
404
  }) && (u = !0);
403
405
  return u;
404
406
  }
405
- function ge(t) {
407
+ function Se(t) {
406
408
  const { currentNode: e, documentModifier: o } = t;
407
409
  if (!e || !("querySelectorAll" in e))
408
410
  return !1;
@@ -410,19 +412,19 @@ function ge(t) {
410
412
  if (r.length === 0)
411
413
  return !1;
412
414
  const l = B(e);
413
- let i = N(l, o, r);
415
+ let i = w(l, o, r);
414
416
  const s = E(e), u = b.getConfig(e);
415
417
  if (s !== "list" && u.mobileLayoutEnabled && "querySelector" in e) {
416
418
  const c = e.querySelector(q);
417
419
  if (c) {
418
- const d = N(c, o, r);
420
+ const d = w(c, o, r);
419
421
  i = i || d;
420
422
  }
421
423
  }
422
424
  return i && o.apply(new p("Updated price formatting in-place")), i;
423
425
  }
424
- function Se(t) {
425
- const { currentNode: e, documentModifier: o, currency: n } = t, r = R(e);
426
+ function be(t) {
427
+ const { currentNode: e, documentModifier: o, currency: n } = t, r = T(e);
426
428
  if (!r)
427
429
  return;
428
430
  const l = n.alignment === "before" ? "0" : "1", i = (s, u) => {
@@ -431,17 +433,17 @@ function Se(t) {
431
433
  i(g.CURRENCY, n.code), i(g.SYMBOL, n.symbol), i(g.ALIGNMENT, l), i(g.THOUSAND_SEPARATOR, n.thousandSeparator), i(g.DECIMAL_SEPARATOR, n.decimalSeparator), i(g.DECIMAL_COUNT, n.decimalCount.toString()), o.apply(new p("Update currency attributes"));
432
434
  }
433
435
  export {
434
- pe as adjustProductsToSize,
436
+ ye as adjustProductsToSize,
435
437
  A as formatProductPrice,
436
- R as getBlockElement,
437
- H as getCardComposition,
438
+ T as getBlockElement,
439
+ x as getCardComposition,
438
440
  E as getCurrentLayout,
439
- Z as reapplySpacing,
440
- J as regenerateMobileProductRows,
441
- Q as regenerateProductRows,
442
- me as regenerateProductRowsWithStyles,
443
- Se as setCurrencyAttributes,
444
- ge as updatePricesInPlace,
445
- ye as updateProductContentInPlace,
446
- te as updateSingleProductContent
441
+ ee as reapplySpacing,
442
+ Q as regenerateMobileProductRows,
443
+ Z as regenerateProductRows,
444
+ pe as regenerateProductRowsWithStyles,
445
+ be as setCurrencyAttributes,
446
+ Se as updatePricesInPlace,
447
+ ge as updateProductContentInPlace,
448
+ oe as updateSingleProductContent
447
449
  };
@@ -1,8 +1,8 @@
1
1
  import r from "../../../static/assets/info.svg.js";
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"] = `
2
+ import { IconsRegistry as C } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
+ class h extends C {
4
+ registerIconsSvg(t) {
5
+ t["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 t {
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
- `, C["grid-orientation"] = `
47
+ `, t["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
- `, C["list-orientation"] = `
54
+ `, t["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,7 +60,21 @@ class h extends t {
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
- `, C["migration-info-icon"] = r;
63
+ `, t["vertical-orientation"] = `
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;
64
78
  }
65
79
  }
66
80
  export {
@@ -18,6 +18,13 @@ 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
+
21
28
  /* Right-align the mobile layout toggle within the two-column grid */
22
29
  .product-layout-control-container ue-switcher {
23
30
  justify-self: end;
@@ -143,15 +150,68 @@ ue-orderable.orderable-disabled .droppable-icon {
143
150
  color: var(--guido-color-danger-500);
144
151
  }
145
152
 
146
- /* Disable drag for list layout */
147
- .orderable-list.orderable-disabled .drag-handle {
148
- display: none;
153
+ /* ─── Inline "Product Prices" group: nested 2-item sub-drag ───────────── */
154
+ .orderable-item.price-group-item {
155
+ flex-direction: column;
156
+ align-items: stretch;
157
+ gap: 8px;
149
158
  }
150
159
 
151
- .orderable-list.orderable-disabled .orderable-item {
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;
172
+ }
173
+
174
+ .price-suborderable-item {
175
+ display: flex;
176
+ align-items: center;
177
+ gap: 4px;
178
+ padding: 8px 0;
179
+ background: var(--guido-color-white);
152
180
  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;
153
200
  }
154
201
 
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
+
155
215
  /* ─── Migration Info Box ─────────────────────────────────────────────── */
156
216
  /* Shown in the settings panel title when a block was migrated from legacy */
157
217
 
@@ -3,10 +3,10 @@ import { useRecommendationApi as y } from "../../../../services/recommendationAp
3
3
  import { useConfigStore as G } from "../../../../stores/config.js";
4
4
  import { defineStore as P } from "pinia";
5
5
  import { DEFAULT_MOBILE_CARDS_IN_ROW as D, DEFAULT_CARDS_IN_ROW as F } from "../constants/layout.js";
6
- import { EXCLUDED_ALGORITHM_IDS as w } from "../constants/defaultConfig.js";
6
+ import { EXCLUDED_ALGORITHM_IDS as v } 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
- import { getPartnerRecommendationParams as v } from "../utils/partnerCustomizations.js";
9
+ import { getPartnerRecommendationParams as w } from "../utils/partnerCustomizations.js";
10
10
  import { isFilterValid as N } from "../validation/filterSchema.js";
11
11
  import { isConfigValid as x } from "../validation/requiredFields.js";
12
12
  const h = y();
@@ -37,7 +37,9 @@ function k() {
37
37
  textTrimming: !0,
38
38
  unresponsive: !1,
39
39
  size: "6",
40
- customAttributes: []
40
+ customAttributes: [],
41
+ priceMovedToNextLine: !0,
42
+ priceHideIfSameAsDiscounted: !1
41
43
  };
42
44
  }
43
45
  function I() {
@@ -117,7 +119,7 @@ const L = () => ({
117
119
  },
118
120
  getActivePredictiveAlgorithms: (t) => {
119
121
  const e = g(), r = [];
120
- return t.activePredictiveAlgorithms.filter((n) => !w.includes(n)).forEach((n) => {
122
+ return t.activePredictiveAlgorithms.filter((n) => !v.includes(n)).forEach((n) => {
121
123
  r.push(...e.filter((c) => c.id === n));
122
124
  }), r.map((n) => ({
123
125
  text: n.name,
@@ -457,7 +459,7 @@ const L = () => ({
457
459
  };
458
460
  r.strategy === "manualMerchandising" ? a.productId = r.productIds.join(",") : r.strategy === "similarViewed" && (a.productId = "{itemId}"), r.strategy === "userBased" && (a.userId = "{user_id}"), c && (a.filter = c), r.shuffleProducts && (a.shuffle = !0), Object.assign(
459
461
  a,
460
- v(o.partnerName, r.strategy)
462
+ w(o.partnerName, r.strategy)
461
463
  );
462
464
  let f;
463
465
  try {