@useinsider/guido 2.1.0-beta.01eaf27 → 2.1.0-beta.13ada05

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.
@@ -1,6 +1,6 @@
1
1
  import { useToaster as w } from "./useToaster.js";
2
2
  const v = () => {
3
- const { handleError: l } = w(), r = (t = {}) => new Promise((e, a) => {
3
+ const { handleError: n } = w(), m = (t = {}) => new Promise((e, a) => {
4
4
  const o = { ...{
5
5
  minimize: !0,
6
6
  utmEntity: {
@@ -21,9 +21,9 @@ const v = () => {
21
21
  resetDataSavedFlag: !1,
22
22
  disableLineHeightsReplace: !0
23
23
  }, ...t }, s = {
24
- callback: (n, p, d, c, u) => {
25
- n ? a(n) : e({
26
- html: p,
24
+ callback: (l, r, d, c, u) => {
25
+ l ? a(l) : e({
26
+ html: r,
27
27
  ampHtml: d,
28
28
  ampErrors: c,
29
29
  displayConditions: u
@@ -34,15 +34,15 @@ const v = () => {
34
34
  window.StripoEditorApi.actionsApi.compileEmail(s);
35
35
  });
36
36
  return {
37
- getCompiledEmail: r,
37
+ getCompiledEmail: m,
38
38
  getTemplateData: () => new Promise((t) => {
39
- const e = ({ html: a, css: i, width: o, height: m, utmParams: s, syncModulesIds: n }) => t({
39
+ const e = ({ html: a, css: i, width: o, height: p, utmParams: s, syncModulesIds: l }) => t({
40
40
  html: a,
41
41
  css: i,
42
42
  width: o,
43
- height: m,
43
+ height: p,
44
44
  utmParams: s,
45
- syncModulesIds: n
45
+ syncModulesIds: l
46
46
  });
47
47
  window.StripoEditorApi.actionsApi.getTemplateData(e);
48
48
  }),
@@ -56,7 +56,7 @@ const v = () => {
56
56
  displayConditions: a,
57
57
  ampHtml: i = "",
58
58
  ampErrors: o = []
59
- } = await r({ minimize: !1, resetDataSavedFlag: !1, ...t });
59
+ } = await m({ minimize: !1, resetDataSavedFlag: !1, ...t });
60
60
  return {
61
61
  html: e,
62
62
  ampHtml: i,
@@ -64,7 +64,7 @@ const v = () => {
64
64
  displayConditions: a
65
65
  };
66
66
  } catch (e) {
67
- return l(e, "Error loading preview"), {
67
+ return n(e, "Error loading preview"), {
68
68
  html: "",
69
69
  ampHtml: "",
70
70
  ampErrors: [],
@@ -80,17 +80,19 @@ const v = () => {
80
80
  }
81
81
  try {
82
82
  window.StripoEditorApi.actionsApi.updateTimerInClonedTemplate((i, o) => {
83
- i ? (l(i, "Failed to update timer in cloned template"), t(null)) : t(o || null);
83
+ i ? (n(i, "Failed to update timer in cloned template"), t(null)) : t(o || null);
84
84
  });
85
85
  } catch (i) {
86
- l(i, "Failed to call updateTimerInClonedTemplate"), t(null);
86
+ n(i, "Failed to call updateTimerInClonedTemplate"), t(null);
87
87
  }
88
88
  }),
89
89
  updateHtmlAndCss: (t, e) => {
90
90
  window.StripoEditorApi.actionsApi.updateHtmlAndCss(t, e);
91
91
  },
92
92
  editorSave: () => {
93
- window.StripoEditorApi.actionsApi.save();
93
+ window.StripoEditorApi.actionsApi.save((t) => {
94
+ t && n(t, "Failed to save template");
95
+ });
94
96
  }
95
97
  };
96
98
  };
@@ -1,18 +1,18 @@
1
- import { useOnboardingStore as l } from "../../../stores/onboarding.js";
2
- import { Block as m, BlockCompositionType as d, ModificationDescription as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
- import { SETTINGS_ENUMS as a, DefaultConfigValues as n } from "./enums/settingsEnums.js";
4
- import { getDefaultTemplate as f } from "./template.js";
5
- import { getItemsBlockContainer as g, getItemsBlockConfig as p, getDefaultItemsBlockConfig as u } from "./utils/nodeConfigUtils.js";
6
- const I = "items-block";
7
- class S extends m {
1
+ import { useOnboardingStore as d } from "../../../stores/onboarding.js";
2
+ import { Block as g, BlockCompositionType as f, ModificationDescription as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
+ import { SETTINGS_ENUMS as c, DefaultConfigValues as i } from "./enums/settingsEnums.js";
4
+ import { getDefaultTemplate as p } from "./template.js";
5
+ import { getItemsBlockContainer as u, getItemsBlockConfig as C, getDefaultItemsBlockConfig as I } from "./utils/nodeConfigUtils.js";
6
+ const y = "items-block";
7
+ class B extends g {
8
8
  getId() {
9
- return I;
9
+ return y;
10
10
  }
11
11
  getIcon() {
12
12
  return "items-icon";
13
13
  }
14
14
  getBlockCompositionType() {
15
- return d.CONTAINER;
15
+ return f.CONTAINER;
16
16
  }
17
17
  getName() {
18
18
  return this.api.translate("Items");
@@ -21,32 +21,34 @@ class S extends m {
21
21
  return this.api.translate("Items lets you display personalized products based on user behavior.");
22
22
  }
23
23
  getTemplate() {
24
- return f({
25
- orientation: a.ORIENTATION.VERTICAL,
26
- itemsType: a.ITEMS_TYPE.CART_ITEMS,
24
+ return p({
25
+ orientation: c.ORIENTATION.VERTICAL,
26
+ itemsType: c.ITEMS_TYPE.CART_ITEMS,
27
27
  itemId: "{{Abandoned Cart Item (1) Url}}",
28
- currencySymbol: n.productPriceCurrencySymbolControlValue,
29
- currencyLocation: n.productPriceCurrencyLocationControlValue,
30
- formattedPrice: n.productPriceFormattedControlValue === "1"
28
+ currencySymbol: i.productPriceCurrencySymbolControlValue,
29
+ currencyLocation: i.productPriceCurrencyLocationControlValue,
30
+ formattedPrice: i.productPriceFormattedControlValue === "1"
31
31
  });
32
32
  }
33
33
  allowInnerBlocksDND() {
34
34
  return !1;
35
35
  }
36
- onCreated(i) {
37
- const t = g(i);
38
- if (!t)
36
+ onCreated(n) {
37
+ const s = this.api.getDocumentModifier(), r = this.api.getDocumentRootCssNode();
38
+ r.querySelector('[product-attr="imageSrc"] img') || s.modifyCss(r).appendRule('[product-attr="imageSrc"] img {object-fit: contain;}');
39
+ const e = u(n);
40
+ if (!e)
39
41
  return;
40
- const r = t.getNodeConfig(), c = r && Object.keys(r).length > 0, e = p(i);
41
- if (e != null && e.initialized)
42
- c ? e.blockInstanceId || this.api.getDocumentModifier().modifyHtml(t).setNodeConfig({ ...e, blockInstanceId: String(Date.now()) }).apply(new o("Assign block instance ID to block")) : this.api.getDocumentModifier().modifyHtml(t).setNodeConfig(e).apply(new o("Migrate legacy config to nodeConfig"));
42
+ const a = e.getNodeConfig(), l = a && Object.keys(a).length > 0, t = C(n);
43
+ if (t != null && t.initialized)
44
+ l ? t.blockInstanceId || this.api.getDocumentModifier().modifyHtml(e).setNodeConfig({ ...t, blockInstanceId: String(Date.now()) }).apply(new o("Assign block instance ID to block")) : this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(t).apply(new o("Migrate legacy config to nodeConfig"));
43
45
  else {
44
- const s = u();
45
- this.api.getDocumentModifier().modifyHtml(t).setNodeConfig(s).apply(new o("Initialize Items block with default configuration")), l().startOnboarding("itemsOnboarding");
46
+ const m = I();
47
+ this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(m).apply(new o("Initialize Items block with default configuration")), d().startOnboarding("itemsOnboarding");
46
48
  }
47
49
  }
48
50
  }
49
51
  export {
50
- I as BLOCK_ID,
51
- S as ItemsBlock
52
+ y as BLOCK_ID,
53
+ B as ItemsBlock
52
54
  };
@@ -1,12 +1,12 @@
1
1
  var I = Object.defineProperty;
2
- var p = (c, r, t) => r in c ? I(c, r, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[r] = t;
3
- var y = (c, r, t) => p(c, typeof r != "symbol" ? r + "" : r, t);
4
- import { ModificationDescription as a } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
5
- import { CommonControl as U } from "../../common-control.js";
6
- import { ItemsBlockId as n } from "../enums/controlEnums.js";
7
- import { SETTINGS_ENUMS as u } from "../enums/settingsEnums.js";
8
- import { getItemsBlockConfig as h, setItemsBlockConfig as b } from "../utils/nodeConfigUtils.js";
9
- const m = "ui-elements-items-card-composition-block", i = {
2
+ var U = (d, a, t) => a in d ? I(d, a, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[a] = t;
3
+ var p = (d, a, t) => U(d, typeof a != "symbol" ? a + "" : a, t);
4
+ import { ModificationDescription as c } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
5
+ import { CommonControl as b } from "../../common-control.js";
6
+ import { ItemsBlockId as r } from "../enums/controlEnums.js";
7
+ import { SETTINGS_ENUMS as h } from "../enums/settingsEnums.js";
8
+ import { getItemsBlockConfig as R, setItemsBlockConfig as m } from "../utils/nodeConfigUtils.js";
9
+ const g = "ui-elements-items-card-composition-block", i = {
10
10
  PRODUCT_IMAGE: "image",
11
11
  PRODUCT_NAME: "name",
12
12
  PRODUCT_QUANTITY: "quantity",
@@ -14,10 +14,10 @@ const m = "ui-elements-items-card-composition-block", i = {
14
14
  PRODUCT_ORIGINAL_PRICE: "originalPrice",
15
15
  PRODUCT_BUTTON: "button"
16
16
  };
17
- class S extends U {
17
+ class M extends b {
18
18
  constructor() {
19
19
  super(...arguments);
20
- y(this, "visibilityState", {
20
+ p(this, "visibilityState", {
21
21
  [i.PRODUCT_IMAGE]: !0,
22
22
  [i.PRODUCT_NAME]: !0,
23
23
  [i.PRODUCT_QUANTITY]: !0,
@@ -27,7 +27,7 @@ class S extends U {
27
27
  });
28
28
  }
29
29
  getId() {
30
- return m;
30
+ return g;
31
31
  }
32
32
  getTemplate() {
33
33
  return `
@@ -39,7 +39,7 @@ class S extends U {
39
39
  { name: i.PRODUCT_PRICE, label: "Product Price" },
40
40
  { name: i.PRODUCT_ORIGINAL_PRICE, label: "Product Original Price" },
41
41
  { name: i.PRODUCT_BUTTON, label: "Product Button" }
42
- ].map((o) => this._getToggleContainer(o)).join("")}
42
+ ].map((e) => this._getToggleContainer(e)).join("")}
43
43
  </div>
44
44
  `;
45
45
  }
@@ -48,14 +48,14 @@ class S extends U {
48
48
  }
49
49
  onTemplateNodeUpdated(t) {
50
50
  super.onTemplateNodeUpdated(t), this.handleBlockInstanceChange(() => {
51
- this._syncVisibilityFromAttributes(), this._handleBrowsedItemsQuantity(), this._applyVisibilityStyles(), this._updateTogglesFromState();
51
+ this._syncVisibilityFromAttributes(), this._handleBrowsedItemsQuantity(!0), this._updateTogglesFromState();
52
52
  });
53
53
  }
54
- _getToggleContainer({ name: t, label: o }) {
54
+ _getToggleContainer({ name: t, label: e }) {
55
55
  return `
56
56
  <div class="container" name="${t}Container">
57
57
  <div class="display-flex align-items-center justify-content-between">
58
- ${this._GuLabel({ text: o, name: `${t}Label` })}
58
+ ${this._GuLabel({ text: e, name: `${t}Label` })}
59
59
  ${this._GuToggle(t)}
60
60
  </div>
61
61
  </div>
@@ -75,10 +75,10 @@ class S extends U {
75
75
  });
76
76
  }
77
77
  _syncVisibilityFromAttributes() {
78
- const t = h(this.currentNode);
78
+ const t = R(this.currentNode);
79
79
  if (!t)
80
80
  return;
81
- const o = {
81
+ const e = {
82
82
  [i.PRODUCT_IMAGE]: "imageVisible",
83
83
  [i.PRODUCT_NAME]: "nameVisible",
84
84
  [i.PRODUCT_QUANTITY]: "quantityControlEnabled",
@@ -86,44 +86,45 @@ class S extends U {
86
86
  [i.PRODUCT_ORIGINAL_PRICE]: "originalPriceVisible",
87
87
  [i.PRODUCT_BUTTON]: "buttonVisible"
88
88
  };
89
- Object.entries(o).forEach(([e, s]) => {
90
- const l = t[s];
91
- this.visibilityState[e] = l !== !1;
89
+ Object.entries(e).forEach(([o, n]) => {
90
+ const s = t[n];
91
+ this.visibilityState[o] = s !== !1;
92
92
  });
93
93
  }
94
94
  /**
95
95
  * If itemsType is not BROWSED_ITEMS, show quantity
96
96
  * If itemsType is BROWSED_ITEMS, hide quantity
97
97
  * and mark it as '0'
98
+ * @param syncOnly - If true, only sync local state and UI without modifying the document
98
99
  */
99
- _handleBrowsedItemsQuantity() {
100
- const t = h(this.currentNode), e = ((t == null ? void 0 : t.type) ?? u.ITEMS_TYPE.CART_ITEMS) !== u.ITEMS_TYPE.BROWSED_ITEMS;
101
- if (!t)
100
+ _handleBrowsedItemsQuantity(t = !1) {
101
+ const e = R(this.currentNode), n = ((e == null ? void 0 : e.type) ?? h.ITEMS_TYPE.CART_ITEMS) !== h.ITEMS_TYPE.BROWSED_ITEMS;
102
+ if (!e)
102
103
  return;
103
- const s = t.quantityControlEnabled !== !1;
104
- this.visibilityState[i.PRODUCT_QUANTITY] = e && s, this.api.setVisibility(`${i.PRODUCT_QUANTITY}Container`, e), this._updateVisibilityAttribute(i.PRODUCT_QUANTITY, e && s);
105
- }
106
- _applyVisibilityStyles() {
107
- const t = {
108
- [i.PRODUCT_IMAGE]: n.IMAGE,
109
- [i.PRODUCT_NAME]: n.NAME,
110
- [i.PRODUCT_QUANTITY]: n.QUANTITY,
111
- [i.PRODUCT_PRICE]: n.PRICE,
112
- [i.PRODUCT_ORIGINAL_PRICE]: n.ORIGINAL_PRICE,
113
- [i.PRODUCT_BUTTON]: n.BUTTON
114
- };
115
- Object.entries(t).forEach(([o, e]) => {
104
+ const s = e.quantityControlEnabled !== !1;
105
+ this.visibilityState[i.PRODUCT_QUANTITY] = n && s, this.api.setVisibility(`${i.PRODUCT_QUANTITY}Container`, n), t || this._updateVisibilityAttribute(i.PRODUCT_QUANTITY, n && s);
106
+ }
107
+ _applyVisibilityStyles(t) {
108
+ const e = {
109
+ [i.PRODUCT_IMAGE]: r.IMAGE,
110
+ [i.PRODUCT_NAME]: r.NAME,
111
+ [i.PRODUCT_QUANTITY]: r.QUANTITY,
112
+ [i.PRODUCT_PRICE]: r.PRICE,
113
+ [i.PRODUCT_ORIGINAL_PRICE]: r.ORIGINAL_PRICE,
114
+ [i.PRODUCT_BUTTON]: r.BUTTON
115
+ }, o = t ?? this.api.getDocumentModifier();
116
+ Object.entries(e).forEach(([n, s]) => {
116
117
  var C;
117
- const s = (C = this.currentNode) == null ? void 0 : C.querySelectorAll(`[esd-extension-block-id="${e}"]`);
118
- if (!s)
118
+ const l = (C = this.currentNode) == null ? void 0 : C.querySelectorAll(`[esd-extension-block-id="${s}"]`);
119
+ if (!l)
119
120
  return;
120
- const l = this.visibilityState[o], T = this.api.getDocumentModifier();
121
- s.forEach((d) => {
122
- T.modifyHtml(d).setStyle("display", l ? "table-cell" : "none");
123
- }), T.apply(new a("Applied visibility from attributes"));
124
- }), this._updatePriceCellWidthsForVerticalLayout();
121
+ const P = this.visibilityState[n];
122
+ l.forEach((T) => {
123
+ o.modifyHtml(T).setStyle("display", P ? "table-cell" : "none");
124
+ });
125
+ }), this._updatePriceCellWidthsForVerticalLayout(o), t || o.apply(new c("Applied visibility styles"));
125
126
  }
126
- _updateVisibilityAttribute(t, o) {
127
+ _updateVisibilityAttribute(t, e, o) {
127
128
  const s = {
128
129
  [i.PRODUCT_IMAGE]: "imageVisible",
129
130
  [i.PRODUCT_NAME]: "nameVisible",
@@ -132,9 +133,9 @@ class S extends U {
132
133
  [i.PRODUCT_ORIGINAL_PRICE]: "originalPriceVisible",
133
134
  [i.PRODUCT_BUTTON]: "buttonVisible"
134
135
  }[t];
135
- s && b(this.currentNode, this.api, {
136
- [s]: o
137
- });
136
+ s && m(this.currentNode, this.api, {
137
+ [s]: e
138
+ }, o);
138
139
  }
139
140
  _listenToFormUpdates() {
140
141
  this.api.onValueChanged(i.PRODUCT_IMAGE, (t) => {
@@ -152,51 +153,67 @@ class S extends U {
152
153
  });
153
154
  }
154
155
  _onProductImageChange(t) {
155
- var e;
156
- const o = (e = this.currentNode) == null ? void 0 : e.querySelector(`[esd-extension-block-id="${n.IMAGE}"]`);
157
- o && (this.visibilityState[i.PRODUCT_IMAGE] = t, this.api.getDocumentModifier().modifyHtml(o).setStyle("display", t ? "table-cell" : "none").apply(new a(`Product image visibility changed to ${t ? "visible" : "hidden"}`)), this._updateVisibilityAttribute(i.PRODUCT_IMAGE, t));
156
+ var s;
157
+ const e = (s = this.currentNode) == null ? void 0 : s.querySelector(`[esd-extension-block-id="${r.IMAGE}"]`);
158
+ if (!e)
159
+ return;
160
+ this.visibilityState[i.PRODUCT_IMAGE] = t;
161
+ const o = this.api.getDocumentModifier();
162
+ o.modifyHtml(e).setStyle("display", t ? "table-cell" : "none"), this._updateVisibilityAttribute(i.PRODUCT_IMAGE, t, o);
163
+ const n = `Product image visibility changed to ${t ? "visible" : "hidden"}`;
164
+ o.apply(new c(n));
158
165
  }
159
166
  _onProductNameChange(t) {
160
- var e;
161
- const o = (e = this.currentNode) == null ? void 0 : e.querySelector(`[esd-extension-block-id="${n.NAME}"]`);
162
- o && (this.visibilityState[i.PRODUCT_NAME] = t, this.api.getDocumentModifier().modifyHtml(o).setStyle("display", t ? "table-cell" : "none").apply(new a(`Product name visibility changed to ${t ? "visible" : "hidden"}`)), this._updateVisibilityAttribute(i.PRODUCT_NAME, t));
167
+ var s;
168
+ const e = (s = this.currentNode) == null ? void 0 : s.querySelector(`[esd-extension-block-id="${r.NAME}"]`);
169
+ if (!e)
170
+ return;
171
+ this.visibilityState[i.PRODUCT_NAME] = t;
172
+ const o = this.api.getDocumentModifier();
173
+ o.modifyHtml(e).setStyle("display", t ? "table-cell" : "none"), this._updateVisibilityAttribute(i.PRODUCT_NAME, t, o);
174
+ const n = `Product name visibility changed to ${t ? "visible" : "hidden"}`;
175
+ o.apply(new c(n));
163
176
  }
164
177
  _onProductQuantityChange(t) {
165
- var e;
166
- const o = (e = this.currentNode) == null ? void 0 : e.querySelector(`[esd-extension-block-id="${n.QUANTITY}"]`);
167
- o && (this.visibilityState[i.PRODUCT_QUANTITY] = t, this.api.getDocumentModifier().modifyHtml(o).setStyle("display", t ? "table-cell" : "none").apply(new a(
168
- `Product quantity visibility changed to ${t ? "visible" : "hidden"}`
169
- )), this._updateVisibilityAttribute(i.PRODUCT_QUANTITY, t));
178
+ var s;
179
+ const e = (s = this.currentNode) == null ? void 0 : s.querySelector(`[esd-extension-block-id="${r.QUANTITY}"]`);
180
+ if (!e)
181
+ return;
182
+ this.visibilityState[i.PRODUCT_QUANTITY] = t;
183
+ const o = this.api.getDocumentModifier();
184
+ o.modifyHtml(e).setStyle("display", t ? "table-cell" : "none"), this._updateVisibilityAttribute(i.PRODUCT_QUANTITY, t, o);
185
+ const n = `Product quantity visibility changed to ${t ? "visible" : "hidden"}`;
186
+ o.apply(new c(n));
170
187
  }
171
188
  _onProductPriceChange(t) {
172
189
  var s;
173
- const o = (s = this.currentNode) == null ? void 0 : s.querySelectorAll(
174
- `[esd-extension-block-id="${n.PRICE}"]`
190
+ const e = (s = this.currentNode) == null ? void 0 : s.querySelectorAll(
191
+ `[esd-extension-block-id="${r.PRICE}"]`
175
192
  );
176
- if (!o)
193
+ if (!e)
177
194
  return;
178
195
  this.visibilityState[i.PRODUCT_PRICE] = t;
179
- const e = this.api.getDocumentModifier();
180
- o.forEach((l) => {
181
- e.modifyHtml(l).setStyle("display", t ? "table-cell" : "none");
182
- }), e.apply(
183
- new a(`Product price visibility changed to ${t ? "visible" : "hidden"}`)
184
- ), this._updateVisibilityAttribute(i.PRODUCT_PRICE, t), this._updatePriceCellWidthsForVerticalLayout();
196
+ const o = this.api.getDocumentModifier();
197
+ e.forEach((l) => {
198
+ o.modifyHtml(l).setStyle("display", t ? "table-cell" : "none");
199
+ }), this._updateVisibilityAttribute(i.PRODUCT_PRICE, t, o), this._updatePriceCellWidthsForVerticalLayout(o);
200
+ const n = `Product price visibility changed to ${t ? "visible" : "hidden"}`;
201
+ o.apply(new c(n));
185
202
  }
186
203
  _onProductOriginalPriceChange(t) {
187
204
  var s;
188
- const o = (s = this.currentNode) == null ? void 0 : s.querySelectorAll(
189
- `[esd-extension-block-id="${n.ORIGINAL_PRICE}"]`
205
+ const e = (s = this.currentNode) == null ? void 0 : s.querySelectorAll(
206
+ `[esd-extension-block-id="${r.ORIGINAL_PRICE}"]`
190
207
  );
191
- if (!o)
208
+ if (!e)
192
209
  return;
193
210
  this.visibilityState[i.PRODUCT_ORIGINAL_PRICE] = t;
194
- const e = this.api.getDocumentModifier();
195
- o.forEach((l) => {
196
- e.modifyHtml(l).setStyle("display", t ? "table-cell" : "none");
197
- }), e.apply(new a(
198
- `Product original price visibility changed to ${t ? "visible" : "hidden"}`
199
- )), this._updateVisibilityAttribute(i.PRODUCT_ORIGINAL_PRICE, t), this._updatePriceCellWidthsForVerticalLayout();
211
+ const o = this.api.getDocumentModifier();
212
+ e.forEach((l) => {
213
+ o.modifyHtml(l).setStyle("display", t ? "table-cell" : "none");
214
+ }), this._updateVisibilityAttribute(i.PRODUCT_ORIGINAL_PRICE, t, o), this._updatePriceCellWidthsForVerticalLayout(o);
215
+ const n = `Product original price visibility changed to ${t ? "visible" : "hidden"}`;
216
+ o.apply(new c(n));
200
217
  }
201
218
  /**
202
219
  * Updates both price cell widths in vertical layout based on priceOrientation and visibility.
@@ -206,33 +223,39 @@ class S extends U {
206
223
  * - When price is hidden, original price cell expands to 100%
207
224
  * - When both are visible, they share 50% each
208
225
  */
209
- _updatePriceCellWidthsForVerticalLayout() {
210
- var R, O;
211
- const t = h(this.currentNode);
212
- if (!((t == null ? void 0 : t.orientation) === u.ORIENTATION.VERTICAL))
226
+ _updatePriceCellWidthsForVerticalLayout(t) {
227
+ var O, y;
228
+ const e = R(this.currentNode);
229
+ if (!((e == null ? void 0 : e.orientation) === h.ORIENTATION.VERTICAL))
213
230
  return;
214
- const e = (R = this.currentNode) == null ? void 0 : R.querySelectorAll(".product-price-class"), s = (O = this.currentNode) == null ? void 0 : O.querySelectorAll(".product-original-price-class"), l = (t == null ? void 0 : t.priceOrientation) === "vertical", T = this.visibilityState[i.PRODUCT_PRICE], C = this.visibilityState[i.PRODUCT_ORIGINAL_PRICE], d = this.api.getDocumentModifier();
215
- if (e && e.length > 0) {
216
- const P = l || !C ? "100%" : "50%";
217
- e.forEach((_) => {
218
- d.modifyHtml(_).setStyle("width", P);
231
+ const n = (O = this.currentNode) == null ? void 0 : O.querySelectorAll(".product-price-class"), s = (y = this.currentNode) == null ? void 0 : y.querySelectorAll(".product-original-price-class"), l = (e == null ? void 0 : e.priceOrientation) === "vertical", P = this.visibilityState[i.PRODUCT_PRICE], C = this.visibilityState[i.PRODUCT_ORIGINAL_PRICE], T = t ?? this.api.getDocumentModifier();
232
+ if (n && n.length > 0) {
233
+ const _ = l || !C ? "100%" : "50%";
234
+ n.forEach((u) => {
235
+ T.modifyHtml(u).setStyle("width", _);
219
236
  });
220
237
  }
221
238
  if (s && s.length > 0) {
222
- const P = l || !T ? "100%" : "50%";
223
- s.forEach((_) => {
224
- d.modifyHtml(_).setStyle("width", P);
239
+ const _ = l || !P ? "100%" : "50%";
240
+ s.forEach((u) => {
241
+ T.modifyHtml(u).setStyle("width", _);
225
242
  });
226
243
  }
227
- d.apply(new a("Updated price cell widths for vertical layout"));
244
+ t || T.apply(new c("Updated price cell widths for vertical layout"));
228
245
  }
229
246
  _onProductButtonChange(t) {
230
- var e;
231
- const o = (e = this.currentNode) == null ? void 0 : e.querySelector(`[esd-extension-block-id="${n.BUTTON}"]`);
232
- o && (this.visibilityState[i.PRODUCT_BUTTON] = t, this.api.getDocumentModifier().modifyHtml(o).setStyle("display", t ? "table-cell" : "none").apply(new a(`Product button visibility changed to ${t ? "visible" : "hidden"}`)), this._updateVisibilityAttribute(i.PRODUCT_BUTTON, t));
247
+ var s;
248
+ const e = (s = this.currentNode) == null ? void 0 : s.querySelector(`[esd-extension-block-id="${r.BUTTON}"]`);
249
+ if (!e)
250
+ return;
251
+ this.visibilityState[i.PRODUCT_BUTTON] = t;
252
+ const o = this.api.getDocumentModifier();
253
+ o.modifyHtml(e).setStyle("display", t ? "table-cell" : "none"), this._updateVisibilityAttribute(i.PRODUCT_BUTTON, t, o);
254
+ const n = `Product button visibility changed to ${t ? "visible" : "hidden"}`;
255
+ o.apply(new c(n));
233
256
  }
234
257
  }
235
258
  export {
236
- m as COMPOSITION_CONTROL_BLOCK_ID,
237
- S as ItemsBlockCardCompositionControl
259
+ g as COMPOSITION_CONTROL_BLOCK_ID,
260
+ M as ItemsBlockCardCompositionControl
238
261
  };
@@ -1,50 +1,50 @@
1
- import { currencyLocationMaps as p } from "../../../../../enums/extensions/recommendationBlock.js";
2
- import { UEAttr as y, ModificationDescription as R } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
- import { CommonControl as L } from "../../../common-control.js";
4
- import { ItemsBlockControlId as u } from "../../enums/controlEnums.js";
5
- import { getItemsBlockConfig as l, setItemsBlockConfig as N, escapeReplacement as I } from "../../utils/nodeConfigUtils.js";
6
- const T = u.PRICE_CURRENCY_LOCATION, i = {
1
+ import { currencyLocationMaps as u } from "../../../../../enums/extensions/recommendationBlock.js";
2
+ import { UEAttr as R, ModificationDescription as L } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
+ import { CommonControl as N } from "../../../common-control.js";
4
+ import { ItemsBlockControlId as m } from "../../enums/controlEnums.js";
5
+ import { getItemsBlockConfig as C, setItemsBlockConfig as I, escapeReplacement as T } from "../../utils/nodeConfigUtils.js";
6
+ const E = m.PRICE_CURRENCY_LOCATION, c = {
7
7
  CURRENCY_LOCATION: "currencyLocation"
8
8
  };
9
- class $ extends L {
9
+ class A extends N {
10
10
  getId() {
11
- return T;
11
+ return E;
12
12
  }
13
13
  getTemplate() {
14
14
  return `
15
- <div class="container ${u.PRICE_CURRENCY_LOCATION}">
15
+ <div class="container ${m.PRICE_CURRENCY_LOCATION}">
16
16
  ${this._getCurrencyLocation()}
17
17
  </div>
18
18
  `;
19
19
  }
20
20
  onRender() {
21
- const e = l(this.currentNode);
22
- this.api.setUIEAttribute(i.CURRENCY_LOCATION, y.SELECTPICKER.items, p), this.api.updateValues({ [i.CURRENCY_LOCATION]: (e == null ? void 0 : e.priceCurrencyLocation) ?? "0" }), this.api.onValueChanged(i.CURRENCY_LOCATION, (t) => {
21
+ const e = C(this.currentNode);
22
+ this.api.setUIEAttribute(c.CURRENCY_LOCATION, R.SELECTPICKER.items, u), this.api.updateValues({ [c.CURRENCY_LOCATION]: (e == null ? void 0 : e.priceCurrencyLocation) ?? "0" }), this.api.onValueChanged(c.CURRENCY_LOCATION, (t) => {
23
23
  this._onCurrencyLocationChange(t);
24
24
  });
25
25
  }
26
26
  onTemplateNodeUpdated(e) {
27
27
  super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(() => {
28
- const t = l(this.currentNode);
29
- this.api.updateValues({ [i.CURRENCY_LOCATION]: (t == null ? void 0 : t.priceCurrencyLocation) ?? "0" });
28
+ const t = C(this.currentNode);
29
+ this.api.updateValues({ [c.CURRENCY_LOCATION]: (t == null ? void 0 : t.priceCurrencyLocation) ?? "0" });
30
30
  });
31
31
  }
32
32
  _onCurrencyLocationChange(e) {
33
- if (console.debug("Currency location changed to: ", e), N(this.currentNode, this.api, { priceCurrencyLocation: e }), !this.currentNode)
33
+ if (console.debug("Currency location changed to: ", e), I(this.currentNode, this.api, { priceCurrencyLocation: e }), !this.currentNode)
34
34
  return;
35
35
  const t = this._getPriceBlocks();
36
36
  if (!t || t.length === 0)
37
37
  return;
38
- const r = l(this.currentNode), n = e || "0", o = (r == null ? void 0 : r.priceCurrencySymbol) ?? "";
39
- t.forEach((s) => {
40
- const c = this._getParagraph(s);
41
- if (!c)
38
+ const r = C(this.currentNode), n = e || "0", o = (r == null ? void 0 : r.priceCurrencySymbol) ?? "", i = this.api.getDocumentModifier();
39
+ t.forEach((a) => {
40
+ const s = this._getParagraph(a);
41
+ if (!s)
42
42
  return;
43
- const m = c.getInnerHTML().trim() || "", a = c.getInnerText().trim() || "", C = (o == null ? void 0 : o.trim()) || "", h = this._removeCurrencySymbol(a, C), d = this._detectSymbolInText(a) || C, g = this._buildPriceContent(h, d, n), _ = m.replace(a, I(g));
44
- this.api.getDocumentModifier().modifyHtml(c).setInnerHtml(_).apply(new R(
45
- `Updated currency location to ${n === "1" ? "after" : "before"}`
46
- ));
47
- });
43
+ const h = s.getInnerHTML().trim() || "", l = s.getInnerText().trim() || "", p = (o == null ? void 0 : o.trim()) || "", d = this._removeCurrencySymbol(l, p), g = this._detectSymbolInText(l) || p, _ = this._buildPriceContent(d, g, n), y = h.replace(l, T(_));
44
+ i.modifyHtml(s).setInnerHtml(y);
45
+ }), i.apply(new L(
46
+ `Updated currency location to ${n === "1" ? "after" : "before"}`
47
+ ));
48
48
  }
49
49
  _getPriceBlocks() {
50
50
  var e, t;
@@ -65,8 +65,8 @@ class $ extends L {
65
65
  } else {
66
66
  const o = r.match(/([^0-9.,\s]+)/);
67
67
  if (o && o[1]) {
68
- const s = o[1].trim(), c = new RegExp(`\\s*${this._escapeRegex(s)}\\s*`);
69
- n = r.replace(c, "").trim();
68
+ const i = o[1].trim(), a = new RegExp(`\\s*${this._escapeRegex(i)}\\s*`);
69
+ n = r.replace(a, "").trim();
70
70
  }
71
71
  }
72
72
  return n;
@@ -83,15 +83,15 @@ class $ extends L {
83
83
  ${this._GuTwoColumns([
84
84
  this._GuLabel({ text: "Currency Location" }),
85
85
  this._GuSelect({
86
- name: i.CURRENCY_LOCATION,
86
+ name: c.CURRENCY_LOCATION,
87
87
  placeholder: "",
88
- options: p
88
+ options: u
89
89
  })
90
90
  ])}
91
91
  `;
92
92
  }
93
93
  }
94
94
  export {
95
- T as CONTROL_BLOCK_ID,
96
- $ as PriceCurrencyLocationControl
95
+ E as CONTROL_BLOCK_ID,
96
+ A as PriceCurrencyLocationControl
97
97
  };