@useinsider/guido 3.8.1-beta.2ee94c2 → 3.8.1-beta.6c331cf

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 (37) hide show
  1. package/dist/composables/useHtmlValidator.js +180 -133
  2. package/dist/config/compiler/utils/recommendationCompilerUtils.js +58 -57
  3. package/dist/config/compiler/utils/recommendationIgnoreUtils.js +15 -0
  4. package/dist/config/migrator/recommendation/extractors.js +44 -22
  5. package/dist/config/migrator/recommendation/htmlBuilder.js +175 -169
  6. package/dist/config/migrator/recommendationMigrator.js +30 -31
  7. package/dist/extensions/Blocks/Items/block.js +48 -29
  8. package/dist/extensions/Blocks/Items/utils/nodeConfigUtils.js +62 -45
  9. package/dist/extensions/Blocks/Recommendation/constants/selectors.js +26 -20
  10. package/dist/extensions/Blocks/Recommendation/controls/cardComposition/index.js +55 -41
  11. package/dist/extensions/Blocks/Recommendation/controls/main/index.js +58 -57
  12. package/dist/extensions/Blocks/Recommendation/controls/main/layoutOrientation.js +43 -31
  13. package/dist/extensions/Blocks/Recommendation/controls/main/productCount.js +3 -2
  14. package/dist/extensions/Blocks/Recommendation/controls/main/productLayout.js +55 -45
  15. package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +63 -56
  16. package/dist/extensions/Blocks/Recommendation/controls/syncInfoMessage.js +7 -6
  17. package/dist/extensions/Blocks/Recommendation/extension.js +3 -2
  18. package/dist/extensions/Blocks/Recommendation/settingsPanel.js +3 -2
  19. package/dist/extensions/Blocks/Recommendation/store/recommendation.js +3 -2
  20. package/dist/extensions/Blocks/Recommendation/templates/grid/template.js +13 -12
  21. package/dist/extensions/Blocks/Recommendation/templates/index.js +7 -6
  22. package/dist/extensions/Blocks/Recommendation/templates/utils.js +1 -1
  23. package/dist/src/composables/useHtmlValidator.d.ts +27 -0
  24. package/dist/src/composables/useHtmlValidator.test.d.ts +1 -0
  25. package/dist/src/config/compiler/utils/recommendationIgnoreUtils.d.ts +17 -0
  26. package/dist/src/config/compiler/utils/recommendationIgnoreUtils.test.d.ts +1 -0
  27. package/dist/src/config/migrator/recommendation/extractors.d.ts +15 -0
  28. package/dist/src/config/migrator/recommendation/htmlBuilder.d.ts +8 -0
  29. package/dist/src/extensions/Blocks/Items/block.d.ts +8 -0
  30. package/dist/src/extensions/Blocks/Items/utils/nodeConfigUtils.d.ts +1 -1
  31. package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts +1 -1
  32. package/dist/src/extensions/Blocks/Recommendation/constants/selectors.d.ts +21 -0
  33. package/dist/src/extensions/Blocks/Recommendation/controls/cardComposition/index.d.ts +7 -0
  34. package/dist/src/extensions/Blocks/Recommendation/controls/main/layoutOrientation.d.ts +5 -0
  35. package/dist/src/extensions/Blocks/Recommendation/controls/main/productLayout.d.ts +6 -0
  36. package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts +9 -0
  37. package/package.json +1 -1
@@ -1,9 +1,9 @@
1
1
  var J = Object.defineProperty;
2
2
  var Q = (p, _, t) => _ in p ? J(p, _, { enumerable: !0, configurable: !0, writable: !0, value: t }) : p[_] = t;
3
- var S = (p, _, t) => Q(p, typeof _ != "symbol" ? _ + "" : _, t);
3
+ var T = (p, _, t) => Q(p, typeof _ != "symbol" ? _ + "" : _, t);
4
4
  import { UIElementType as f, UEAttr as I, ModificationDescription as A } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
5
5
  import { CommonControl as Z } from "../../../common-control.js";
6
- import { ATTR_PRODUCT_IMAGE as D, ATTR_PRODUCT_NAME as tt, ATTR_PRODUCT_PRICE as et, ATTR_PRODUCT_OLD_PRICE as rt, ATTR_PRODUCT_OMNIBUS_PRICE as ot, ATTR_PRODUCT_OMNIBUS_DISCOUNT as st, ATTR_PRODUCT_BUTTON as U, ATTR_DATA_CUSTOM_ATTRIBUTES as q, ATTR_CUSTOM_PREFIX as m, BUILT_IN_DEFAULT_ATTRIBUTES as it } from "../../constants/selectors.js";
6
+ import { ATTR_PRODUCT_IMAGE as L, ATTR_PRODUCT_NAME as tt, ATTR_PRODUCT_PRICE as et, ATTR_PRODUCT_OLD_PRICE as rt, ATTR_PRODUCT_OMNIBUS_PRICE as ot, ATTR_PRODUCT_OMNIBUS_DISCOUNT as st, ATTR_PRODUCT_BUTTON as B, ATTR_DATA_CUSTOM_ATTRIBUTES as q, ATTR_CUSTOM_PREFIX as m, BUILT_IN_DEFAULT_ATTRIBUTES as it } from "../../constants/selectors.js";
7
7
  import { DEFAULT_COMPOSITION as P, DEFAULT_VISIBILITY as F } from "../../constants/defaultConfig.js";
8
8
  import { RecommendationConfigService as nt } from "../../services/configService.js";
9
9
  import { useRecommendationExtensionStore as lt } from "../../store/recommendation.js";
@@ -11,32 +11,32 @@ import { ATTRIBUTE_CELL_CLASS as at, gridElementRenderer as ct, DEFAULT_CELL_PAD
11
11
  import { listElementRenderer as mt } from "../../templates/list/elementRenderer.js";
12
12
  import { toDisplayName as ht, isDefaultAttribute as pt, toDisplayableAttributeValue as _t, buildElementRenderer as w } from "../../templates/utils.js";
13
13
  import { getTableDisplayValue as ft } from "../../utils/tagName.js";
14
- import { getCurrentLayout as gt } from "../main/utils.js";
15
- const bt = "ui-elements-recommendation-card-composition", C = ".recommendation-attribute-row", L = ".product-card-wrapper > tbody", M = ".product-info-cell > table > tbody", V = "data-card-composition", y = "data-attribute-type", v = "data-visibility", x = {
14
+ import { isPartnerManagedBlock as gt, getCurrentLayout as bt } from "../main/utils.js";
15
+ const yt = "ui-elements-recommendation-card-composition", S = ".recommendation-attribute-row", N = ".product-card-wrapper > tbody", M = ".product-info-cell > table > tbody", V = "data-card-composition", y = "data-attribute-type", v = "data-visibility", x = {
16
16
  ADD_ATTRIBUTE: "addAttribute"
17
17
  }, g = 5, E = "reorderIcon_", h = [
18
- { key: D, label: "Product Image" },
18
+ { key: L, label: "Product Image" },
19
19
  { key: tt, label: "Product Name" },
20
20
  { key: et, label: "Product Price" },
21
21
  { key: rt, label: "Product Original Price" },
22
22
  { key: ot, label: "Omnibus Price" },
23
23
  { key: st, label: "Omnibus Discount" },
24
- { key: U, label: "Product Button" }
25
- ], yt = new Set(h.map((p) => p.key)), T = "customAttr_", R = "deleteAttr_";
24
+ { key: B, label: "Product Button" }
25
+ ], At = new Set(h.map((p) => p.key)), C = "customAttr_", R = "deleteAttr_";
26
26
  class Ut extends Z {
27
27
  constructor() {
28
28
  super(...arguments);
29
- S(this, "store", lt());
30
- S(this, "unsubscribeStore", null);
31
- S(this, "eventController", null);
29
+ T(this, "store", lt());
30
+ T(this, "unsubscribeStore", null);
31
+ T(this, "eventController", null);
32
32
  /**
33
33
  * Guard flag: when true, onTemplateNodeUpdated skips _initializeComposition.
34
34
  * Used during _onReorder to prevent multiple intermediate rebuilds.
35
35
  */
36
- S(this, "reorderInProgress", !1);
36
+ T(this, "reorderInProgress", !1);
37
37
  }
38
38
  getId() {
39
- return bt;
39
+ return yt;
40
40
  }
41
41
  // ========================================================================
42
42
  // Lifecycle
@@ -49,9 +49,9 @@ class Ut extends Z {
49
49
  `).join(""), r = Array.from(
50
50
  { length: g },
51
51
  (l, u) => `
52
- <div data-custom-select-key="${T}${u}" style="display: none;">
52
+ <div data-custom-select-key="${C}${u}" style="display: none;">
53
53
  ${this._GuSelect({
54
- name: `${T}${u}`,
54
+ name: `${C}${u}`,
55
55
  placeholder: this.api.translate("Select Attribute"),
56
56
  options: []
57
57
  })}
@@ -128,10 +128,24 @@ class Ut extends Z {
128
128
  `;
129
129
  }
130
130
  onRender() {
131
- this._initializeComposition(), this._registerValueChangeListeners(), this._setupEventListeners(), this._updateOrderableState(), this._subscribeToStoreChanges();
131
+ this._initializeComposition(), this._registerValueChangeListeners(), this._setupEventListeners(), this._updateOrderableState(), this._subscribeToStoreChanges(), this._syncDisabledState();
132
+ }
133
+ /**
134
+ * Card composition restructures the block (toggles/reorders/adds attribute
135
+ * cells), which would corrupt a partner-managed (`ins-skip-compile`) block's
136
+ * preserved markup. There is no native tab-disable API, so the whole control
137
+ * container is rendered inert (greyed + non-interactive) instead.
138
+ */
139
+ _syncDisabledState() {
140
+ var e;
141
+ const t = (e = this.getContainer()) == null ? void 0 : e.querySelector("[data-card-composition-control]");
142
+ if (!t)
143
+ return;
144
+ const r = gt(this.currentNode);
145
+ t.style.pointerEvents = r ? "none" : "", t.style.opacity = r ? "0.5" : "";
132
146
  }
133
147
  onTemplateNodeUpdated(t) {
134
- super.onTemplateNodeUpdated(t), !this.reorderInProgress && (this._initializeComposition(), this._updateOrderableState());
148
+ super.onTemplateNodeUpdated(t), !this.reorderInProgress && (this._initializeComposition(), this._updateOrderableState(), this._syncDisabledState());
135
149
  }
136
150
  onDestroy() {
137
151
  super.onDestroy(), this.eventController && (this.eventController.abort(), this.eventController = null), this.unsubscribeStore && (this.unsubscribeStore(), this.unsubscribeStore = null);
@@ -150,7 +164,7 @@ class Ut extends Z {
150
164
  });
151
165
  });
152
166
  for (let t = 0; t < g; t++) {
153
- const r = `${T}${t}`, e = t;
167
+ const r = `${C}${t}`, e = t;
154
168
  this.api.onValueChanged(r, (o) => {
155
169
  this._onCustomAttributeChanged(e, o);
156
170
  });
@@ -180,7 +194,7 @@ class Ut extends Z {
180
194
  _readVisibilityFromRows() {
181
195
  if (!this.currentNode)
182
196
  return this._getDefaultVisibilities();
183
- const t = Array.from(this.currentNode.querySelectorAll(C)), r = this._extractVisibilityFromRows(t);
197
+ const t = Array.from(this.currentNode.querySelectorAll(S)), r = this._extractVisibilityFromRows(t);
184
198
  return this._mergeWithDefaults(r);
185
199
  }
186
200
  _getDefaultVisibilities() {
@@ -224,7 +238,7 @@ class Ut extends Z {
224
238
  const s = new Set(r);
225
239
  let i = 0, n = 0;
226
240
  const a = t.map((c) => {
227
- if (yt.has(c)) {
241
+ if (At.has(c)) {
228
242
  const l = h.find((u) => u.key === c);
229
243
  return this._createBuiltInItemHtml(l, n++);
230
244
  }
@@ -315,7 +329,7 @@ class Ut extends Z {
315
329
  _initializeCustomSelects(t) {
316
330
  t.length !== 0 && setTimeout(() => {
317
331
  t.forEach((r, e) => {
318
- const o = `${T}${e}`, s = this._getSelectOptions(r, t);
332
+ const o = `${C}${e}`, s = this._getSelectOptions(r, t);
319
333
  this.api.setUIEAttribute(o, I.SELECTPICKER.items, s), this.api.updateValues({ [o]: r });
320
334
  });
321
335
  }, 0);
@@ -339,7 +353,7 @@ class Ut extends Z {
339
353
  */
340
354
  _moveSelectsIntoItems(t, r) {
341
355
  for (let e = 0; e < r; e++) {
342
- const o = `${T}${e}`, s = t.querySelector(`[data-custom-select-key="${o}"]`), i = t.querySelector(`[data-custom-select-slot="${e}"]`);
356
+ const o = `${C}${e}`, s = t.querySelector(`[data-custom-select-key="${o}"]`), i = t.querySelector(`[data-custom-select-slot="${e}"]`);
343
357
  if (s && i) {
344
358
  const n = s.querySelector("ue-select");
345
359
  n && i.appendChild(n);
@@ -367,7 +381,7 @@ class Ut extends Z {
367
381
  */
368
382
  _rescueSelectsToStore(t) {
369
383
  for (let r = 0; r < g; r++) {
370
- const e = `${T}${r}`, o = t.querySelector(`[data-custom-select-key="${e}"]`), s = t.querySelector(`[data-custom-select-slot="${r}"]`);
384
+ const e = `${C}${r}`, o = t.querySelector(`[data-custom-select-key="${e}"]`), s = t.querySelector(`[data-custom-select-slot="${r}"]`);
371
385
  if (s) {
372
386
  const i = s.querySelector("ue-select");
373
387
  i && o && o.appendChild(i);
@@ -525,18 +539,18 @@ class Ut extends Z {
525
539
  this._getCurrentLayout() === "grid" ? this._injectGridAttributeRow(t, r, e, o) : this._injectListAttributeRow(t, r, e, o);
526
540
  }
527
541
  _injectGridAttributeRow(t, r, e, o) {
528
- const s = this.currentNode.querySelectorAll(L);
542
+ const s = this.currentNode.querySelectorAll(N);
529
543
  if (!(s != null && s.length))
530
544
  return;
531
545
  const i = nt.getConfig(this.currentNode), a = `0 ${Math.floor(i.columnSpacing / 2)}px`, c = this.api.getDocumentModifier(), l = this.store.recommendationProducts.length;
532
546
  let u = 0;
533
547
  s.forEach((d) => {
534
- var H;
535
- const b = d.querySelector(C), $ = ((H = b == null ? void 0 : b.querySelectorAll(`.${at}`)) == null ? void 0 : H.length) || 1, B = (100 / $).toFixed(2), { bgStyle: j, bgAttr: W } = this._extractSegmentBgFromCard(d), O = l > 0 ? Math.min($, l - u) : $, K = o.map((k) => {
536
- if (k === e) {
548
+ var k;
549
+ const b = d.querySelector(S), $ = ((k = b == null ? void 0 : b.querySelectorAll(`.${at}`)) == null ? void 0 : k.length) || 1, U = (100 / $).toFixed(2), { bgStyle: j, bgAttr: W } = this._extractSegmentBgFromCard(d), O = l > 0 ? Math.min($, l - u) : $, K = o.map((H) => {
550
+ if (H === e) {
537
551
  const z = Array.from(
538
552
  { length: O },
539
- (At, Y) => {
553
+ (St, Y) => {
540
554
  const X = this._resolveAttributeContent(
541
555
  t,
542
556
  r,
@@ -545,19 +559,19 @@ class Ut extends Z {
545
559
  return this._getGridCellHtml(
546
560
  t,
547
561
  X,
548
- B,
562
+ U,
549
563
  j,
550
564
  W,
551
565
  a
552
566
  );
553
567
  }
554
- ).join(""), G = dt(B, a).repeat($ - O);
568
+ ).join(""), G = dt(U, a).repeat($ - O);
555
569
  return `<tr class="recommendation-attribute-row" ${y}="${e}" ${v}="1">${z}${G}</tr>`;
556
570
  }
557
- const N = d.querySelector(
558
- `${C}[${y}="${k}"]`
571
+ const D = d.querySelector(
572
+ `${S}[${y}="${H}"]`
559
573
  );
560
- return N && "getOuterHTML" in N ? N.getOuterHTML() : "";
574
+ return D && "getOuterHTML" in D ? D.getOuterHTML() : "";
561
575
  }).join("");
562
576
  u += O, l > 0 && u >= l && (u = 0), c.modifyHtml(d).setInnerHtml(K);
563
577
  }), c.apply(new A(`${this.api.translate("Add custom attribute")}: ${r}`));
@@ -566,7 +580,7 @@ class Ut extends Z {
566
580
  const s = this.currentNode.querySelectorAll(M);
567
581
  if (!(s != null && s.length))
568
582
  return;
569
- const i = o.filter((a) => a !== D && a !== U), n = this.api.getDocumentModifier();
583
+ const i = o.filter((a) => a !== L && a !== B), n = this.api.getDocumentModifier();
570
584
  s.forEach((a, c) => {
571
585
  const l = i.map((u) => {
572
586
  if (u === e) {
@@ -574,7 +588,7 @@ class Ut extends Z {
574
588
  return this._getListRowHtml(t, b, e);
575
589
  }
576
590
  const d = a.querySelector(
577
- `${C}[${y}="${u}"]`
591
+ `${S}[${y}="${u}"]`
578
592
  );
579
593
  return d && "getOuterHTML" in d ? d.getOuterHTML() : "";
580
594
  }).join("");
@@ -590,13 +604,13 @@ class Ut extends Z {
590
604
  return;
591
605
  const r = this._getCurrentLayout(), e = this.api.getDocumentModifier();
592
606
  if (r === "grid") {
593
- const o = this.currentNode.querySelectorAll(L);
607
+ const o = this.currentNode.querySelectorAll(N);
594
608
  o == null || o.forEach((s) => {
595
609
  const i = this._buildCompositionHtml(s, t);
596
610
  e.modifyHtml(s).setInnerHtml(i);
597
611
  });
598
612
  } else {
599
- const o = t.filter((i) => i !== D && i !== U), s = this.currentNode.querySelectorAll(M);
613
+ const o = t.filter((i) => i !== L && i !== B), s = this.currentNode.querySelectorAll(M);
600
614
  s == null || s.forEach((i) => {
601
615
  const n = this._buildCompositionHtml(i, o);
602
616
  e.modifyHtml(i).setInnerHtml(n);
@@ -624,7 +638,7 @@ class Ut extends Z {
624
638
  _reorderProductAttributes(t) {
625
639
  if (!this.currentNode)
626
640
  return;
627
- const r = this.currentNode.querySelectorAll(L);
641
+ const r = this.currentNode.querySelectorAll(N);
628
642
  if (!(r != null && r.length))
629
643
  return;
630
644
  const e = this.api.getDocumentModifier();
@@ -639,7 +653,7 @@ class Ut extends Z {
639
653
  */
640
654
  _buildCompositionHtml(t, r) {
641
655
  return r.reduce((e, o) => {
642
- const s = t.querySelector(`${C}[${y}="${o}"]`);
656
+ const s = t.querySelector(`${S}[${y}="${o}"]`);
643
657
  return s && "getOuterHTML" in s ? e + s.getOuterHTML() : e;
644
658
  }, "");
645
659
  }
@@ -649,7 +663,7 @@ class Ut extends Z {
649
663
  _applyVisibilityToBlock(t, r) {
650
664
  if (!this.currentNode)
651
665
  return;
652
- const e = this.currentNode.querySelectorAll(`${C}[${y}="${t}"]`);
666
+ const e = this.currentNode.querySelectorAll(`${S}[${y}="${t}"]`);
653
667
  if (!(e != null && e.length))
654
668
  return;
655
669
  const o = r ? "1" : "0", s = r ? this.api.translate("visible") : this.api.translate("hidden"), i = `${this.api.translate("Set visibility")}: ${t} → ${s}`, n = this.api.getDocumentModifier();
@@ -677,7 +691,7 @@ class Ut extends Z {
677
691
  return -1;
678
692
  }
679
693
  _getCurrentLayout() {
680
- return this.store.recommendationConfigs.orientation || gt(this.currentNode);
694
+ return this.store.recommendationConfigs.orientation || bt(this.currentNode);
681
695
  }
682
696
  /**
683
697
  * Extracts background color properties from existing card elements.
@@ -793,6 +807,6 @@ class Ut extends Z {
793
807
  }
794
808
  }
795
809
  export {
796
- bt as COMPOSITION_CONTROL_BLOCK_ID,
810
+ yt as COMPOSITION_CONTROL_BLOCK_ID,
797
811
  Ut as RecommendationCardCompositionControl
798
812
  };
@@ -1,31 +1,31 @@
1
1
  var C = Object.defineProperty;
2
- var p = (d, a, t) => a in d ? C(d, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[a] = t;
3
- var s = (d, a, t) => p(d, typeof a != "symbol" ? a + "" : a, t);
4
- import { CommonControl as g } from "../../../common-control.js";
5
- import { DEFAULT_NODE_CONFIG as l } from "../../constants/defaultConfig.js";
2
+ var g = (d, c, t) => c in d ? C(d, c, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[c] = t;
3
+ var s = (d, c, t) => g(d, typeof c != "symbol" ? c + "" : c, t);
4
+ import { CommonControl as p } from "../../../common-control.js";
5
+ import { DEFAULT_NODE_CONFIG as a } from "../../constants/defaultConfig.js";
6
6
  import { RecommendationConfigService as h } from "../../services/configService.js";
7
7
  import { useRecommendationExtensionStore as y } from "../../store/recommendation.js";
8
8
  import { AlgorithmControl as R } from "./algorithm.js";
9
- import { ALGORITHM_CONTROL_ID as Q } from "./algorithm.js";
10
- import { CurrencyControl as b } from "./currency.js";
11
- import { CURRENCY_CONTROL_ID as Z } from "./currency.js";
12
- import { FiltersControl as N } from "./filters.js";
13
- import { FILTERS_CONTROL_ID as et } from "./filters.js";
9
+ import { ALGORITHM_CONTROL_ID as X } from "./algorithm.js";
10
+ import { CurrencyControl as N } from "./currency.js";
11
+ import { CURRENCY_CONTROL_ID as tt } from "./currency.js";
12
+ import { FiltersControl as b } from "./filters.js";
13
+ import { FILTERS_CONTROL_ID as ot } from "./filters.js";
14
14
  import { LayoutOrientationControl as I } from "./layoutOrientation.js";
15
- import { LAYOUT_ORIENTATION_CONTROL_ID as rt } from "./layoutOrientation.js";
15
+ import { LAYOUT_ORIENTATION_CONTROL_ID as nt } from "./layoutOrientation.js";
16
16
  import { LocaleControl as _ } from "./locale.js";
17
- import { LOCALE_CONTROL_ID as it } from "./locale.js";
17
+ import { LOCALE_CONTROL_ID as st } from "./locale.js";
18
18
  import { ProductCountControl as O } from "./productCount.js";
19
- import { PRODUCT_COUNT_CONTROL_ID as lt } from "./productCount.js";
19
+ import { PRODUCT_COUNT_CONTROL_ID as ct } from "./productCount.js";
20
20
  import { ProductLayoutControl as T } from "./productLayout.js";
21
- import { PRODUCT_LAYOUT_CONTROL_ID as ct } from "./productLayout.js";
21
+ import { PRODUCT_LAYOUT_CONTROL_ID as ut } from "./productLayout.js";
22
22
  import { ShuffleControl as S } from "./shuffle.js";
23
- import { SHUFFLE_CONTROL_ID as dt } from "./shuffle.js";
24
- import { setCurrencyAttributes as L, getBlockElement as P, updateProductContentInPlace as k, regenerateProductRowsWithStyles as D } from "./utils.js";
25
- import { adjustProductsToSize as mt, formatProductPrice as ft, getCardComposition as Ct, getCurrentLayout as pt, regenerateMobileProductRows as gt, updatePricesInPlace as yt, updateSingleProductContent as Rt } from "./utils.js";
23
+ import { SHUFFLE_CONTROL_ID as ht } from "./shuffle.js";
24
+ import { setCurrencyAttributes as L, getBlockElement as P, isPartnerManagedBlock as k, updateProductContentInPlace as D, regenerateProductRowsWithStyles as E } from "./utils.js";
25
+ import { adjustProductsToSize as ft, formatProductPrice as Ct, getCardComposition as gt, getCurrentLayout as pt, regenerateMobileProductRows as yt, updatePricesInPlace as Rt, updateSingleProductContent as Nt } from "./utils.js";
26
26
  import { useDebounceFn as m } from "../../../../../node_modules/@vueuse/shared/index.js";
27
- const E = "recommendation-id", w = "ui-elements-recommendation-block";
28
- class K extends g {
27
+ const w = "recommendation-id", B = "ui-elements-recommendation-block";
28
+ class q extends p {
29
29
  constructor() {
30
30
  super(...arguments);
31
31
  s(this, "store", y());
@@ -60,14 +60,14 @@ class K extends g {
60
60
  */
61
61
  s(this, "_debouncedRegenerateWithProducts", m(() => {
62
62
  const t = this.store.recommendationProducts;
63
- if (!this.currentNode || !this.api)
63
+ if (!this.currentNode || !this.api || k(this.currentNode))
64
64
  return;
65
65
  const e = this.api.getDocumentModifier();
66
- k({
66
+ D({
67
67
  currentNode: this.currentNode,
68
68
  documentModifier: e,
69
69
  products: t
70
- }) || D({
70
+ }) || E({
71
71
  currentNode: this.currentNode,
72
72
  documentModifier: e,
73
73
  products: t
@@ -75,10 +75,10 @@ class K extends g {
75
75
  }, 100));
76
76
  }
77
77
  getId() {
78
- return w;
78
+ return B;
79
79
  }
80
80
  getTemplate() {
81
- return this.algorithmControl = new R(), this.localeControl = new _(), this.currencyControl = new b(), this.productCountControl = new O(), this.productLayoutControl = new T(), this.filtersControl = new N(), this.shuffleControl = new S(), this.layoutOrientationControl = new I(), [
81
+ return this.algorithmControl = new R(), this.localeControl = new _(), this.currencyControl = new N(), this.productCountControl = new O(), this.productLayoutControl = new T(), this.filtersControl = new b(), this.shuffleControl = new S(), this.layoutOrientationControl = new I(), [
82
82
  this.algorithmControl,
83
83
  this.localeControl,
84
84
  this.currencyControl,
@@ -241,26 +241,26 @@ class K extends g {
241
241
  return;
242
242
  const t = h.getConfig(this.currentNode), e = {};
243
243
  let o = null, r = null, n = null;
244
- if (t.currency.code === l.currency.code) {
244
+ if (t.currency.code === a.currency.code) {
245
245
  const { currencyList: i } = this.store;
246
246
  i.length > 0 && (i.some(
247
- (u) => u.value === `price.${l.currency.code}`
247
+ (u) => u.value === `price.${a.currency.code}`
248
248
  ) || (o = i[0].value.replace("price.", ""), e.currency = {
249
- ...l.currency,
249
+ ...a.currency,
250
250
  code: o,
251
251
  symbol: o
252
252
  }));
253
253
  }
254
- if (t.strategy === l.strategy) {
254
+ if (t.strategy === a.strategy) {
255
255
  const i = this.store.getActivePredictiveAlgorithms;
256
256
  i.length > 0 && (i.some(
257
- (u) => u.value === l.strategy
257
+ (u) => u.value === a.strategy
258
258
  ) || (r = i[0].value, e.strategy = r));
259
259
  }
260
- if (t.language === l.language) {
260
+ if (t.language === a.language) {
261
261
  const i = this.store.getLanguages;
262
262
  i.length > 0 && (i.some(
263
- (u) => u.value === l.language
263
+ (u) => u.value === a.language
264
264
  ) || (n = i[0].value, e.language = n));
265
265
  }
266
266
  !o && !r && !n || (h.updateConfig(
@@ -278,10 +278,10 @@ class K extends g {
278
278
  name: o,
279
279
  value: o,
280
280
  symbol: o,
281
- alignment: l.currency.alignment === "before" ? "0" : "1",
282
- decimalCount: l.currency.decimalCount.toString(),
283
- decimalSeparator: l.currency.decimalSeparator,
284
- thousandSeparator: l.currency.thousandSeparator
281
+ alignment: a.currency.alignment === "before" ? "0" : "1",
282
+ decimalCount: a.currency.decimalCount.toString(),
283
+ decimalSeparator: a.currency.decimalSeparator,
284
+ thousandSeparator: a.currency.thousandSeparator
285
285
  }
286
286
  } : {},
287
287
  ...r ? { strategy: r } : {},
@@ -295,7 +295,7 @@ class K extends g {
295
295
  const e = P(t);
296
296
  if (!e || !("getAttribute" in e))
297
297
  return null;
298
- const o = e.getAttribute(E);
298
+ const o = e.getAttribute(w);
299
299
  if (!o)
300
300
  return null;
301
301
  const r = parseInt(o);
@@ -325,8 +325,8 @@ class K extends g {
325
325
  }
326
326
  const i = t.$state.configVersion;
327
327
  i !== o && (o = i, this._persistFiltersToNodeConfig(), this._debouncedFetchProducts());
328
- const c = t.recommendationProducts, u = c !== e, f = Array.isArray(c) && c.length > 0;
329
- u && f && (e = c, this._debouncedRegenerateWithProducts());
328
+ const l = t.recommendationProducts, u = l !== e, f = Array.isArray(l) && l.length > 0;
329
+ u && f && (e = l, this._debouncedRegenerateWithProducts());
330
330
  });
331
331
  }
332
332
  /**
@@ -346,33 +346,34 @@ class K extends g {
346
346
  }
347
347
  }
348
348
  export {
349
- Q as ALGORITHM_CONTROL_ID,
349
+ X as ALGORITHM_CONTROL_ID,
350
350
  R as AlgorithmControl,
351
- w as CONTROL_BLOCK_ID,
352
- Z as CURRENCY_CONTROL_ID,
353
- b as CurrencyControl,
354
- et as FILTERS_CONTROL_ID,
355
- N as FiltersControl,
356
- rt as LAYOUT_ORIENTATION_CONTROL_ID,
357
- it as LOCALE_CONTROL_ID,
351
+ B as CONTROL_BLOCK_ID,
352
+ tt as CURRENCY_CONTROL_ID,
353
+ N as CurrencyControl,
354
+ ot as FILTERS_CONTROL_ID,
355
+ b as FiltersControl,
356
+ nt as LAYOUT_ORIENTATION_CONTROL_ID,
357
+ st as LOCALE_CONTROL_ID,
358
358
  I as LayoutOrientationControl,
359
359
  _ as LocaleControl,
360
- lt as PRODUCT_COUNT_CONTROL_ID,
361
- ct as PRODUCT_LAYOUT_CONTROL_ID,
360
+ ct as PRODUCT_COUNT_CONTROL_ID,
361
+ ut as PRODUCT_LAYOUT_CONTROL_ID,
362
362
  O as ProductCountControl,
363
363
  T as ProductLayoutControl,
364
- K as RecommendationBlockControl,
365
- dt as SHUFFLE_CONTROL_ID,
364
+ q as RecommendationBlockControl,
365
+ ht as SHUFFLE_CONTROL_ID,
366
366
  S as ShuffleControl,
367
- mt as adjustProductsToSize,
368
- ft as formatProductPrice,
367
+ ft as adjustProductsToSize,
368
+ Ct as formatProductPrice,
369
369
  P as getBlockElement,
370
- Ct as getCardComposition,
370
+ gt as getCardComposition,
371
371
  pt as getCurrentLayout,
372
- gt as regenerateMobileProductRows,
373
- D as regenerateProductRowsWithStyles,
372
+ k as isPartnerManagedBlock,
373
+ yt as regenerateMobileProductRows,
374
+ E as regenerateProductRowsWithStyles,
374
375
  L as setCurrencyAttributes,
375
- yt as updatePricesInPlace,
376
- k as updateProductContentInPlace,
377
- Rt as updateSingleProductContent
376
+ Rt as updatePricesInPlace,
377
+ D as updateProductContentInPlace,
378
+ Nt as updateSingleProductContent
378
379
  };
@@ -1,13 +1,14 @@
1
- var L = Object.defineProperty;
2
- var _ = (o, e, t) => e in o ? L(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
3
- var s = (o, e, t) => _(o, typeof e != "symbol" ? e + "" : e, t);
4
- import { ModificationDescription as h } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
5
- import { CommonControl as N } from "../../../common-control.js";
6
- import { LAYOUT_OPTIONS as O, DEFAULT_MOBILE_ROW_SPACING as m, DEFAULT_MOBILE_COLUMN_SPACING as d, DEFAULT_ROW_SPACING as l, DEFAULT_COLUMN_SPACING as g } from "../../constants/layout.js";
7
- import { RecommendationConfigService as a } from "../../services/configService.js";
8
- import { useRecommendationExtensionStore as A } from "../../store/recommendation.js";
9
- import { getCurrentLayout as C, getBlockElement as f, getCardComposition as S, regenerateProductRowsWithStyles as T } from "./utils.js";
10
- const I = "recommendation-layout-orientation-control", u = {
1
+ var h = Object.defineProperty;
2
+ var p = (o, e, t) => e in o ? h(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
3
+ var a = (o, e, t) => p(o, typeof e != "symbol" ? e + "" : e, t);
4
+ import { UEAttr as L, ModificationDescription as N } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
5
+ import { CommonControl as A } from "../../../common-control.js";
6
+ import "../../constants/selectors.js";
7
+ import { LAYOUT_OPTIONS as O, DEFAULT_MOBILE_ROW_SPACING as d, DEFAULT_MOBILE_COLUMN_SPACING as m, DEFAULT_ROW_SPACING as l, DEFAULT_COLUMN_SPACING as g } from "../../constants/layout.js";
8
+ import { RecommendationConfigService as u } from "../../services/configService.js";
9
+ import { useRecommendationExtensionStore as S } from "../../store/recommendation.js";
10
+ import { isPartnerManagedBlock as f, getCurrentLayout as C, getBlockElement as T, getCardComposition as U, regenerateProductRowsWithStyles as I } from "./utils.js";
11
+ const y = "recommendation-layout-orientation-control", s = {
11
12
  LAYOUT: "layout"
12
13
  }, n = {
13
14
  LAYOUT: "data-layout",
@@ -16,14 +17,14 @@ const I = "recommendation-layout-orientation-control", u = {
16
17
  MOBILE_COLUMN_SPACING: "data-mobile-column-spacing",
17
18
  MOBILE_ROW_SPACING: "data-mobile-row-spacing"
18
19
  };
19
- class w extends N {
20
+ class F extends A {
20
21
  constructor() {
21
22
  super(...arguments);
22
- s(this, "store", A());
23
- s(this, "isChangingLayout", !1);
23
+ a(this, "store", S());
24
+ a(this, "isChangingLayout", !1);
24
25
  }
25
26
  getId() {
26
- return I;
27
+ return y;
27
28
  }
28
29
  getTemplate() {
29
30
  return `
@@ -31,7 +32,7 @@ class w extends N {
31
32
  ${this._GuTwoColumns([
32
33
  this._GuLabel({ text: this.api.translate("Layout Orientation") }),
33
34
  this._GuRadioButton({
34
- name: u.LAYOUT,
35
+ name: s.LAYOUT,
35
36
  buttons: O
36
37
  })
37
38
  ])}
@@ -39,15 +40,26 @@ class w extends N {
39
40
  `;
40
41
  }
41
42
  onRender() {
42
- this._setFormValues(), this._listenToFormUpdates();
43
+ this._setFormValues(), this._syncDisabledState(), this._listenToFormUpdates();
43
44
  }
44
45
  onTemplateNodeUpdated(t) {
45
- super.onTemplateNodeUpdated(t), this._setFormValues();
46
+ super.onTemplateNodeUpdated(t), this._setFormValues(), this._syncDisabledState();
47
+ }
48
+ /**
49
+ * Layout orientation restructures the whole block, which is meaningless for
50
+ * partner-managed (`ins-skip-compile`) blocks — disable the control there.
51
+ */
52
+ _syncDisabledState() {
53
+ this.api.setUIEAttribute(
54
+ s.LAYOUT,
55
+ L.RADIO_BUTTONS.disabled,
56
+ f(this.currentNode)
57
+ );
46
58
  }
47
59
  _setFormValues() {
48
- const r = a.getConfig(this.currentNode).layout || C(this.currentNode);
60
+ const r = u.getConfig(this.currentNode).layout || C(this.currentNode);
49
61
  this.api.updateValues({
50
- [u.LAYOUT]: r
62
+ [s.LAYOUT]: r
51
63
  });
52
64
  }
53
65
  /**
@@ -55,27 +67,27 @@ class w extends N {
55
67
  * Updates node config, data attribute and regenerates product rows
56
68
  */
57
69
  _onLayoutChange(t) {
58
- if (this.isChangingLayout || !this.currentNode || (a.getConfig(this.currentNode).layout || C(this.currentNode)) === t)
70
+ if (this.isChangingLayout || !this.currentNode || (u.getConfig(this.currentNode).layout || C(this.currentNode)) === t)
59
71
  return;
60
- const c = f(this.currentNode);
72
+ const c = T(this.currentNode);
61
73
  if (c) {
62
74
  this.isChangingLayout = !0;
63
75
  try {
64
- const p = S(this.currentNode);
65
- a.updateConfig(
76
+ const _ = U(this.currentNode);
77
+ u.updateConfig(
66
78
  this.api,
67
79
  this.currentNode,
68
80
  {
69
81
  layout: t,
70
82
  columnSpacing: g,
71
83
  rowSpacing: l,
72
- mobileColumnSpacing: d,
73
- mobileRowSpacing: m
84
+ mobileColumnSpacing: m,
85
+ mobileRowSpacing: d
74
86
  },
75
87
  `Changed layout to ${t}`
76
88
  ), this.store.patchCurrentBlockConfig({ orientation: t });
77
- const i = this.api.getDocumentModifier().modifyHtml(c).setAttribute(n.LAYOUT, t).setAttribute(n.COLUMN_SPACING, g.toString()).setAttribute(n.ROW_SPACING, l.toString()).setAttribute(n.MOBILE_COLUMN_SPACING, d.toString()).setAttribute(n.MOBILE_ROW_SPACING, m.toString());
78
- t === "list" ? (i.setClass("es-m-p0"), i.setClass("ins-recommendation-list-layout")) : (i.removeClass("es-m-p0"), i.removeClass("ins-recommendation-list-layout")), i.apply(new h(`Update layout to ${t}`)), this._regenerateProductRows(t, p);
89
+ const i = this.api.getDocumentModifier().modifyHtml(c).setAttribute(n.LAYOUT, t).setAttribute(n.COLUMN_SPACING, g.toString()).setAttribute(n.ROW_SPACING, l.toString()).setAttribute(n.MOBILE_COLUMN_SPACING, m.toString()).setAttribute(n.MOBILE_ROW_SPACING, d.toString());
90
+ t === "list" ? (i.setClass("es-m-p0"), i.setClass("ins-recommendation-list-layout")) : (i.removeClass("es-m-p0"), i.removeClass("ins-recommendation-list-layout")), i.apply(new N(`Update layout to ${t}`)), this._regenerateProductRows(t, _);
79
91
  } finally {
80
92
  this.isChangingLayout = !1;
81
93
  }
@@ -88,7 +100,7 @@ class w extends N {
88
100
  * @param composition - The preserved card composition, incl. customAttr:* entries
89
101
  */
90
102
  _regenerateProductRows(t, r) {
91
- this.currentNode && T({
103
+ this.currentNode && I({
92
104
  currentNode: this.currentNode,
93
105
  documentModifier: this.api.getDocumentModifier(),
94
106
  layout: t,
@@ -96,12 +108,12 @@ class w extends N {
96
108
  });
97
109
  }
98
110
  _listenToFormUpdates() {
99
- this.api.onValueChanged(u.LAYOUT, (t) => {
111
+ this.api.onValueChanged(s.LAYOUT, (t) => {
100
112
  this._onLayoutChange(t);
101
113
  });
102
114
  }
103
115
  }
104
116
  export {
105
- I as LAYOUT_ORIENTATION_CONTROL_ID,
106
- w as LayoutOrientationControl
117
+ y as LAYOUT_ORIENTATION_CONTROL_ID,
118
+ F as LayoutOrientationControl
107
119
  };
@@ -2,13 +2,14 @@ var s = Object.defineProperty;
2
2
  var u = (e, o, t) => o in e ? s(e, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[o] = t;
3
3
  var i = (e, o, t) => u(e, typeof o != "symbol" ? o + "" : o, t);
4
4
  import { CommonControl as a } from "../../../common-control.js";
5
+ import "../../constants/selectors.js";
5
6
  import { MAX_PRODUCT_COUNT as c } from "../../constants/layout.js";
6
7
  import { RecommendationConfigService as n } from "../../services/configService.js";
7
8
  import { useRecommendationExtensionStore as d } from "../../store/recommendation.js";
8
9
  const C = "recommendation-product-count-control", r = {
9
10
  PRODUCT_COUNT: "size"
10
11
  };
11
- class g extends a {
12
+ class U extends a {
12
13
  constructor() {
13
14
  super(...arguments);
14
15
  i(this, "store", d());
@@ -54,5 +55,5 @@ class g extends a {
54
55
  }
55
56
  export {
56
57
  C as PRODUCT_COUNT_CONTROL_ID,
57
- g as ProductCountControl
58
+ U as ProductCountControl
58
59
  };