@useinsider/guido 2.0.0-beta.89b1a0f → 2.0.0-beta.9a5f81c

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 (35) hide show
  1. package/dist/components/organisms/email-preview/desktop-preview/DesktopPreview.vue.js +2 -2
  2. package/dist/components/organisms/email-preview/mobile-preview/ContentView.vue.js +5 -5
  3. package/dist/config/migrator/index.js +9 -8
  4. package/dist/config/migrator/itemsBlockMigrator.js +283 -0
  5. package/dist/extensions/Blocks/Items/block.js +39 -40
  6. package/dist/extensions/Blocks/Items/controls/button/link.js +11 -11
  7. package/dist/extensions/Blocks/Items/controls/cardComposition.js +46 -49
  8. package/dist/extensions/Blocks/Items/controls/image/link.js +8 -8
  9. package/dist/extensions/Blocks/Items/controls/name/trimming.js +13 -15
  10. package/dist/extensions/Blocks/Items/controls/price/currencyLocation.js +1 -1
  11. package/dist/extensions/Blocks/Items/controls/price/currencySymbol.js +1 -1
  12. package/dist/extensions/Blocks/Items/controls/price/formattedPrice.js +15 -17
  13. package/dist/extensions/Blocks/Items/controls/price/hideDiscount.js +15 -15
  14. package/dist/extensions/Blocks/Items/controls/price/priceOrientation.js +29 -27
  15. package/dist/extensions/Blocks/Items/controls/settingsControl.js +143 -138
  16. package/dist/extensions/Blocks/Items/enums/settingsEnums.js +2 -2
  17. package/dist/extensions/Blocks/Items/layouts/horizontal.html.js +58 -48
  18. package/dist/extensions/Blocks/Items/layouts/vertical.html.js +48 -58
  19. package/dist/extensions/Blocks/Items/settingsPanel.js +4 -4
  20. package/dist/extensions/Blocks/Items/store/items-block.js +2 -2
  21. package/dist/extensions/Blocks/Items/template.js +312 -125
  22. package/dist/extensions/Blocks/Items/utils/nodeConfigUtils.js +172 -0
  23. package/dist/extensions/Blocks/Items/utils/syncAttributesFromConfigBlock.js +11 -20
  24. package/dist/extensions/Blocks/Recommendation/control.js +1 -1
  25. package/dist/extensions/Blocks/common-control.js +64 -53
  26. package/dist/guido.css +1 -1
  27. package/dist/node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js +366 -287
  28. package/dist/package.json.js +1 -1
  29. package/dist/src/config/migrator/itemsBlockMigrator.d.ts +6 -0
  30. package/dist/src/extensions/Blocks/Items/controls/price/priceOrientation.d.ts +1 -1
  31. package/dist/src/extensions/Blocks/Items/controls/settingsControl.d.ts +0 -4
  32. package/dist/src/extensions/Blocks/Items/template.d.ts +20 -1
  33. package/dist/src/extensions/Blocks/Items/utils/nodeConfigUtils.d.ts +71 -0
  34. package/dist/src/extensions/Blocks/common-control.d.ts +13 -8
  35. package/package.json +3 -3
@@ -7,14 +7,14 @@ var s = function() {
7
7
  return [t(e.EmailHeaderInfo)];
8
8
  }, proxy: !0 }, { key: "headerRightSlot", fn: function() {
9
9
  return [t(e.EmailSizeIndicator)];
10
- }, proxy: !0 }]) }, [e.isContainerReady ? t("iframe", { staticClass: "email-iframe w-1 bor-w-0", style: { height: e.iframeHeight }, attrs: { sandbox: "allow-same-origin allow-popups allow-forms allow-scripts", srcdoc: e.previewStore.previewHtml } }) : r._e()])], 1);
10
+ }, proxy: !0 }]) }, [e.isContainerReady ? t("iframe", { staticClass: "email-iframe w-1 bor-w-0", style: { height: e.iframeHeight }, attrs: { sandbox: "allow-same-origin allow-popups allow-forms allow-scripts allow-popups-to-escape-sandbox", srcdoc: e.previewStore.previewHtml } }) : r._e()])], 1);
11
11
  }, i = [], n = /* @__PURE__ */ a(
12
12
  o,
13
13
  s,
14
14
  i,
15
15
  !1,
16
16
  null,
17
- "2dd60b0c"
17
+ "b37f3f6d"
18
18
  );
19
19
  const d = n.exports;
20
20
  export {
@@ -1,19 +1,19 @@
1
1
  import n from "./ContentView.vue2.js";
2
2
  import e from "../../../../_virtual/_plugin-vue2_normalizer.js";
3
- var c = function() {
3
+ var o = function() {
4
4
  var a = this, s = a._self._c, t = a._self._setupProxy;
5
5
  return s("div", { staticClass: "w-1 h-1 b-c-4 d-f f-d-c" }, [s("div", { staticClass: "d-f j-c-s-b a-i-c p-2 h-6-s" }, [s("div", { staticClass: "d-f a-i-c cur-p", on: { click: function(l) {
6
6
  return a.$emit("back-to-inbox");
7
- } } }, [s(t.InIcons, { staticClass: "f-s-3 i-c-7", attrs: { name: "line-chevron-left" } }), s("span", { staticClass: "ml-2 f-s-1 f-w-400 l-h-1 t-c-7" }, [a._v(a._s(t.trans("newsletter.inbox")))])], 1), s("div", { staticClass: "d-f a-i-c" }, [s(t.InIcons, { staticClass: "i-c-52", attrs: { name: "line-chevron-down" } }), s(t.InIcons, { staticClass: "ml-1 i-c-52", attrs: { name: "line-chevron-up" } })], 1)]), s("iframe", { ref: "iframeRef", staticClass: "f-g-1 w-1 d-b b-c-4 bor-s-n", attrs: { sandbox: "allow-same-origin allow-popups allow-forms allow-scripts", srcdoc: t.previewStore.previewHtml }, on: { load: t.onLoad } })]);
8
- }, i = [], o = /* @__PURE__ */ e(
7
+ } } }, [s(t.InIcons, { staticClass: "f-s-3 i-c-7", attrs: { name: "line-chevron-left" } }), s("span", { staticClass: "ml-2 f-s-1 f-w-400 l-h-1 t-c-7" }, [a._v(a._s(t.trans("newsletter.inbox")))])], 1), s("div", { staticClass: "d-f a-i-c" }, [s(t.InIcons, { staticClass: "i-c-52", attrs: { name: "line-chevron-down" } }), s(t.InIcons, { staticClass: "ml-1 i-c-52", attrs: { name: "line-chevron-up" } })], 1)]), s("iframe", { ref: "iframeRef", staticClass: "f-g-1 w-1 d-b b-c-4 bor-s-n", attrs: { sandbox: "allow-same-origin allow-popups allow-forms allow-scripts allow-popups-to-escape-sandbox", srcdoc: t.previewStore.previewHtml }, on: { load: t.onLoad } })]);
8
+ }, c = [], i = /* @__PURE__ */ e(
9
9
  n,
10
+ o,
10
11
  c,
11
- i,
12
12
  !1,
13
13
  null,
14
14
  null
15
15
  );
16
- const d = o.exports;
16
+ const d = i.exports;
17
17
  export {
18
18
  d as default
19
19
  };
@@ -1,12 +1,13 @@
1
- import { migrateCheckbox as m } from "./checkboxMigrator.js";
1
+ import { migrateCheckbox as t } from "./checkboxMigrator.js";
2
2
  import { migrateCouponBlock as o } from "./couponBlockMigrator.js";
3
- import { migrateRadioButton as i } from "./radioButtonMigrator.js";
4
- import { migrateRecommendation as e } from "./recommendationMigrator.js";
5
- import { migrateUnsubscribe as a } from "./unsubscribeMigrator.js";
6
- const s = async (t) => {
7
- let r = t;
8
- return r = m(r), r = i(r), r = await a(r), r = o(r), r = e(r), r;
3
+ import { migrateItemsBlock as i } from "./itemsBlockMigrator.js";
4
+ import { migrateRadioButton as e } from "./radioButtonMigrator.js";
5
+ import { migrateRecommendation as a } from "./recommendationMigrator.js";
6
+ import { migrateUnsubscribe as g } from "./unsubscribeMigrator.js";
7
+ const u = async (r) => {
8
+ let m = r;
9
+ return m = t(m), m = e(m), m = await g(m), m = o(m), m = a(m), m = i(m), m;
9
10
  };
10
11
  export {
11
- s as migrate
12
+ u as migrate
12
13
  };
@@ -0,0 +1,283 @@
1
+ var B = Object.defineProperty;
2
+ var q = (o, t, r) => t in o ? B(o, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : o[t] = r;
3
+ var A = (o, t, r) => q(o, typeof t != "symbol" ? t + "" : t, r);
4
+ import { productPairs as L } from "../../extensions/Blocks/Items/enums/productEnums.js";
5
+ import { ItemInCartOptions as I, DefaultConfigValues as m, SETTINGS_ENUMS as l } from "../../extensions/Blocks/Items/enums/settingsEnums.js";
6
+ import { getDefaultTemplate as K } from "../../extensions/Blocks/Items/template.js";
7
+ const V = {
8
+ ins_apr_img: {
9
+ pairsKey: "imageSrc",
10
+ defaultKey: "DEFAULT",
11
+ isArray: !0
12
+ },
13
+ ins_apr_name: {
14
+ pairsKey: "name",
15
+ defaultKey: "DEFAULT",
16
+ isArray: !0
17
+ },
18
+ ins_apr_url: {
19
+ pairsKey: "button",
20
+ defaultKey: "DEFAULT_HREF",
21
+ isArray: !1
22
+ },
23
+ ins_apr_formattedprice: {
24
+ pairsKey: "price",
25
+ defaultKey: "DEFAULT_PRICE_FORMATTED",
26
+ isArray: !1
27
+ },
28
+ ins_apr_productcurrency: {
29
+ pairsKey: "price",
30
+ defaultKey: "DEFAULT_CURRENCY",
31
+ isArray: !1
32
+ },
33
+ ins_apr_quantity: {
34
+ pairsKey: "quantity",
35
+ defaultKey: "DEFAULT",
36
+ isArray: !1
37
+ },
38
+ ins_apr_price: {
39
+ pairsKey: "price",
40
+ defaultKey: "DEFAULT_PRICE",
41
+ isArray: !1
42
+ },
43
+ ins_apr_originalprice: {
44
+ pairsKey: "originalPrice",
45
+ defaultKey: "DEFAULT_PRICE",
46
+ isArray: !1
47
+ },
48
+ ins_apr_originalformattedprice: {
49
+ pairsKey: "originalPrice",
50
+ defaultKey: "DEFAULT_PRICE_FORMATTED",
51
+ isArray: !1
52
+ }
53
+ };
54
+ function U() {
55
+ return String(Date.now() + Math.floor(Math.random() * 1e3));
56
+ }
57
+ function F(o) {
58
+ return o ? {
59
+ CartItems: l.ITEMS_TYPE.CART_ITEMS,
60
+ BrowsedItems: l.ITEMS_TYPE.BROWSED_ITEMS,
61
+ PurchasedItems: l.ITEMS_TYPE.PURCHASED_ITEMS,
62
+ CART_ITEMS: l.ITEMS_TYPE.CART_ITEMS,
63
+ BROWSED_ITEMS: l.ITEMS_TYPE.BROWSED_ITEMS,
64
+ PURCHASED_ITEMS: l.ITEMS_TYPE.PURCHASED_ITEMS
65
+ }[o] || l.ITEMS_TYPE.CART_ITEMS : l.ITEMS_TYPE.CART_ITEMS;
66
+ }
67
+ function D(o) {
68
+ const t = (e, a) => e == null ? a : e === "1" || e === "true", r = (e, a) => e || a, c = o["data-type"] || o["data-source"], n = F(c);
69
+ let i = o["data-cart_items_select_control_value"] || m.cartItemsSelectControlValue;
70
+ if (i && !i.includes("{{") && /^\d+$/.test(i)) {
71
+ const e = parseInt(i) - 1, a = I[n];
72
+ a && a[e] && (i = a[e].value);
73
+ }
74
+ return {
75
+ initialized: !0,
76
+ blockInstanceId: r(o["data-block-instance-id"], U()),
77
+ source: n,
78
+ type: n,
79
+ itemsSelectValue: i,
80
+ orientation: o["data-card_orientation_control_value"] || l.ORIENTATION.VERTICAL,
81
+ nameTrimming: t(o["data-product_name_trimming"], !0),
82
+ nameControlEnabled: t(o["data-product_name_control_enabled"], !0),
83
+ priceHideDiscount: t(o["data-product_price_hide_discount"], !1),
84
+ priceFormatted: t(o["data-product_price_formatted"], !0),
85
+ priceCurrencySymbol: r(
86
+ o["data-product_price_currency_symbol"],
87
+ m.productPriceCurrencySymbolControlValue
88
+ ),
89
+ priceCurrencyLocation: r(
90
+ o["data-product_price_currency_location"],
91
+ m.productPriceCurrencyLocationControlValue
92
+ ),
93
+ priceControlOpened: t(o["data-product_price_control_opened"], !0),
94
+ priceOrientation: o["data-product_original_price_control_orientation"] || "horizontal",
95
+ quantityControlEnabled: t(o["data-product_quantity_control_enabled"], !0),
96
+ buttonLink: r(o["data-product_button_link"], m.productButtonLinkControlValue),
97
+ imageLink: r(o["data-product_image_link"], m.productImageLinkControlValue),
98
+ buttonLabel: r(o["data-product_button_control_label"], "Buy"),
99
+ imageVisible: t(o["data-product_image_visible"], !0),
100
+ nameVisible: t(o["data-product_name_visible"], !0),
101
+ quantityVisible: t(o["data-product_quantity_visible"], !0),
102
+ priceVisible: t(o["data-product_price_visible"], !0),
103
+ originalPriceVisible: t(o["data-product_original_price_control_enabled"], !0),
104
+ buttonVisible: t(o["data-product_button_visible"], !0)
105
+ };
106
+ }
107
+ class w {
108
+ constructor() {
109
+ A(this, "parser");
110
+ A(this, "DATA_TYPE", "CART_ITEMS");
111
+ this.parser = new DOMParser();
112
+ }
113
+ migrate(t) {
114
+ try {
115
+ let r = this.removeJinjaConditionals(t);
116
+ r = this.replaceTemplateVariables(r);
117
+ const c = this.parser.parseFromString(r, "text/html"), n = c.querySelectorAll("td.esd-cart-items-block");
118
+ return n.length === 0 ? (console.warn('ItemsBlockMigrator: No blocks found with selector "td.esd-cart-items-block"'), r) : (n.forEach((i) => {
119
+ const e = this.extractConfiguration(i), a = K({
120
+ orientation: e.orientation,
121
+ itemsType: e.itemsType,
122
+ itemId: e.itemId,
123
+ currencySymbol: e.currencySymbol,
124
+ currencyLocation: e.currencyLocation,
125
+ formattedPrice: e.formattedPrice,
126
+ configBlockAttributes: e.configBlockAttributes,
127
+ migrate: !0,
128
+ nameStyles: e.nameStyles,
129
+ buttonStyles: e.buttonStyles,
130
+ priceStyles: e.priceStyles,
131
+ originalPriceStyles: e.originalPriceStyles,
132
+ quantityStyles: e.quantityStyles,
133
+ nodeConfig: D(e.configBlockAttributes)
134
+ }), u = this.parser.parseFromString(
135
+ `<table><tbody><tr>${a}</tr></tbody></table>`,
136
+ "text/html"
137
+ ).querySelector("td");
138
+ if (u && i.parentNode) {
139
+ const s = D(e.configBlockAttributes);
140
+ u.setAttribute("esd-ext-config", JSON.stringify(s));
141
+ const p = u.querySelector("esd-config-block");
142
+ p && p.remove(), i.parentNode.replaceChild(u, i);
143
+ }
144
+ }), c.documentElement.outerHTML);
145
+ } catch (r) {
146
+ return console.error("ItemsBlockMigrator failed:", r), t;
147
+ }
148
+ }
149
+ /**
150
+ * Extracts configuration from legacy HTML block
151
+ * Parses data attributes and structure to determine:
152
+ * - orientation, itemsType, itemNumber, currency settings, esd-config-block attributes
153
+ * - UI styles from product elements (name, price, button, quantity, etc.)
154
+ */
155
+ extractConfiguration(t) {
156
+ var E, C, P;
157
+ const r = ((E = t.querySelector("[data-type]")) == null ? void 0 : E.getAttribute("data-type")) || "CART_ITEMS", c = ((C = t.querySelector("[data-number]")) == null ? void 0 : C.getAttribute("data-number")) || "1", n = parseInt(c) - 1, i = I[r], e = ((P = i == null ? void 0 : i[n]) == null ? void 0 : P.value) || i[0].value, a = t.querySelector('[product-attr="price"]'), _ = (a == null ? void 0 : a.getAttribute("data-currency_symbol")) || void 0, s = ((a == null ? void 0 : a.getAttribute("data-curency")) || "before") === "after" ? "1" : "0", p = (a == null ? void 0 : a.getAttribute("data-formated")) !== "false", y = this.extractConfigBlockAttributes(t, r), f = y["data-product_original_price_control_orientation"] === "vertical" ? "vertical" : "horizontal", d = t.querySelector('a[product-attr="name"]'), v = (d == null ? void 0 : d.getAttribute("style")) || void 0, b = t.querySelector('a[product-attr="button"]'), M = (b == null ? void 0 : b.getAttribute("style")) || void 0, h = (a == null ? void 0 : a.getAttribute("style")) || void 0, S = t.querySelector('[product-attr="originalPrice"]'), R = (S == null ? void 0 : S.getAttribute("style")) || void 0, T = t.querySelector('[product-attr="quantity"]'), k = (T == null ? void 0 : T.getAttribute("style")) || void 0;
158
+ return {
159
+ orientation: f,
160
+ itemsType: r,
161
+ itemId: e,
162
+ currencySymbol: _,
163
+ currencyLocation: s,
164
+ formattedPrice: p,
165
+ configBlockAttributes: y,
166
+ nameStyles: v,
167
+ buttonStyles: M,
168
+ priceStyles: h,
169
+ originalPriceStyles: R,
170
+ quantityStyles: k
171
+ };
172
+ }
173
+ /**
174
+ * Extracts all data-* attributes from the esd-config-block element
175
+ * Returns a key-value mapping of all configuration attributes
176
+ * @param block - The block element containing the esd-config-block
177
+ * @param itemsType - The type of items (CART_ITEMS, BROWSED_ITEMS, PURCHASED_ITEMS)
178
+ */
179
+ extractConfigBlockAttributes(t, r) {
180
+ const c = t.querySelector("esd-config-block"), n = {};
181
+ if (!c)
182
+ return this.getDefaultConfigBlockAttributes();
183
+ if (Array.from(c.attributes).forEach((e) => {
184
+ e.name.startsWith("data-") && (n[e.name] = e.value);
185
+ }), n["data-cart_items_select_control_value"]) {
186
+ const e = n["data-cart_items_select_control_value"];
187
+ if (/^\d+$/.test(e)) {
188
+ const a = parseInt(e) - 1, _ = I[r];
189
+ _ && _[a] && (n["data-cart_items_select_control_value"] = _[a].value);
190
+ }
191
+ }
192
+ if (n["data-product_price_control_curency"]) {
193
+ const e = n["data-product_price_control_curency"];
194
+ e === "before" ? n["data-product_price_control_curency"] = "0" : e === "after" && (n["data-product_price_control_curency"] = "1");
195
+ }
196
+ (!n["data-product_price_currency_symbol"] || n["data-product_price_currency_symbol"].trim() === "") && (n["data-product_price_currency_symbol"] = "USD");
197
+ const i = { ...this.getDefaultConfigBlockAttributes(), ...n };
198
+ return i["data-type"] = r, i["data-source"] = r, i;
199
+ }
200
+ /**
201
+ * Returns default esd-config-block attributes based on the old template structure
202
+ * These serve as fallbacks when attributes are missing
203
+ */
204
+ getDefaultConfigBlockAttributes() {
205
+ return {
206
+ "data-type": "CART_ITEMS",
207
+ "data-product_image_control_opened": "false",
208
+ "data-product_image_control_image-width": "250",
209
+ "data-product_image_control_image-height": "250",
210
+ "data-product_image_control_align_button": "true",
211
+ "data-product_image_control_padding_mobile": "true",
212
+ "data-product_name_control_opened": "false",
213
+ "data-product_quantity_control_opened": "true",
214
+ // DONE
215
+ "data-product_quantity_control_enabled": "false",
216
+ "data-product_name_control_font_font_size": "20",
217
+ "data-product_price_control_opened": "false",
218
+ "data-product_price_control_font_font_size": "20",
219
+ "data-product_price_control_color": "#060606",
220
+ "data-product_price_control_curency": "0",
221
+ "data-product_price_currency_symbol": "USD",
222
+ "data-product_original_price_control_opened": "false",
223
+ "data-product_original_price_control_font_font_size": "19",
224
+ "data-product_original_price_control_align_align_desktop": "center",
225
+ "data-product_original_price_control_orientation": "vertical",
226
+ "data-product_button_control_opened": "true",
227
+ "data-product_button_control_label": "Comprar",
228
+ // DONE
229
+ "data-product_button_control_font_font_size": "17",
230
+ "data-product_button_control_color": "#ffffff",
231
+ "data-product_button_control_background": "#010101",
232
+ "data-product_button_control_atw": "false",
233
+ "data-product_original_price_control_enabled": "false"
234
+ };
235
+ }
236
+ /**
237
+ * Removes Jinja2 conditional statements from HTML
238
+ * - Removes {% if ins_apr_total_product_kind > N %}
239
+ * - Removes {% if ins_apr_price_N != ins_apr_originalprice_N %}
240
+ * - Removes {% endif %}
241
+ */
242
+ removeJinjaConditionals(t) {
243
+ let r = t.replace(/\{%\s*if\s+ins_apr_total_product_kind\s*(&gt;|>)\s*\d+\s*%\}/g, "");
244
+ return r = r.replace(/\{%\s*if\s+ins_apr_price_\d+\s*(!&#61;|!=)\s*ins_apr_originalprice_\d+\s*%\}/g, ""), r = r.replace(/\{%\s*endif\s*%\}/g, ""), r = r.replace(/\n\s*\n\s*\n/g, `
245
+
246
+ `), r;
247
+ }
248
+ /**
249
+ * Replaces template variables with default values from productPairs
250
+ *
251
+ * Examples:
252
+ * - {{ins_apr_img_1}} → https://s3.../ins_apr_img_1.jpeg (array-based, uses index 0)
253
+ * - {{ins_apr_name_2}} → 'Set of Sprite Yoga Straps' (array-based, uses index 1)
254
+ * - {{ins_apr_formattedprice_1}} → '1,100.00' (single value, ignores index)
255
+ * - {{ins_apr_url_3}} → '#!' (single value, ignores index)
256
+ */
257
+ replaceTemplateVariables(t) {
258
+ const { PAIRS_FOR_EXTENSION: r } = L;
259
+ return t.replace(/{{([^}]+)}}/g, (c, n) => {
260
+ const i = n.match(/^(ins_apr_[a-z]+)_(\d+)$/);
261
+ if (!i)
262
+ return c;
263
+ const [, e, a] = i, _ = V[e];
264
+ if (!_)
265
+ return console.warn(`Unknown variable mapping for: ${e}`), c;
266
+ const { pairsKey: u, defaultKey: s, isArray: p } = _, y = r[u][this.DATA_TYPE];
267
+ if (!y)
268
+ return console.warn(`No data found for: ${u}.${this.DATA_TYPE}`), c;
269
+ if (p) {
270
+ const f = parseInt(a) - 1, d = y[s];
271
+ return Array.isArray(d) && d[f] ? d[f] : (console.warn(`Array value not found: ${u}.${this.DATA_TYPE}.${s}[${f}]`), c);
272
+ }
273
+ const g = y[s];
274
+ return g !== void 0 ? String(g) : (console.warn(`Default value not found: ${u}.${this.DATA_TYPE}.${s}`), c);
275
+ });
276
+ }
277
+ }
278
+ function $(o) {
279
+ return new w().migrate(o);
280
+ }
281
+ export {
282
+ $ as migrateItemsBlock
283
+ };
@@ -1,20 +1,20 @@
1
- import { useOnboardingStore as y } from "../../../stores/onboarding.js";
2
- import { Block as R, BlockCompositionType as L, ModificationDescription as a } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
- import { configAttributes as t } from "./enums/productEnums.js";
4
- import { DefaultConfigValues as e, SETTINGS_ENUMS as l } from "./enums/settingsEnums.js";
5
- import { useItemsBlockStore as S } from "./store/items-block.js";
6
- import { getDefaultTemplate as V } from "./template.js";
7
- import { syncCurrencySymbolFromAttributes as B, syncCurrencyLocationFromAttributes as U, syncFormattedPriceFromAttributes as k } from "./utils/syncAttributesFromConfigBlock.js";
8
- const M = "items-block";
9
- class x extends R {
1
+ import { useOnboardingStore as d } from "../../../stores/onboarding.js";
2
+ import { Block as u, BlockCompositionType as p, ModificationDescription as n } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
3
+ import { ItemsBlockId as f } from "./enums/controlEnums.js";
4
+ import { SETTINGS_ENUMS as c, DefaultConfigValues as o } from "./enums/settingsEnums.js";
5
+ import { useItemsBlockStore as g } from "./store/items-block.js";
6
+ import { getDefaultTemplate as y } from "./template.js";
7
+ import { getItemsBlockContainer as C, getItemsBlockConfig as a, getDefaultItemsBlockConfig as I } from "./utils/nodeConfigUtils.js";
8
+ const b = "items-block";
9
+ class O extends u {
10
10
  getId() {
11
- return M;
11
+ return b;
12
12
  }
13
13
  getIcon() {
14
14
  return "items-icon";
15
15
  }
16
16
  getBlockCompositionType() {
17
- return L.CONTAINER;
17
+ return p.CONTAINER;
18
18
  }
19
19
  getName() {
20
20
  return this.api.translate("Items");
@@ -23,45 +23,44 @@ class x extends R {
23
23
  return this.api.translate("Items lets you display personalized products based on user behavior.");
24
24
  }
25
25
  getTemplate() {
26
- return V({
27
- orientation: l.ORIENTATION.HORIZONTAL,
28
- itemsType: l.ITEMS_TYPE.CART_ITEMS,
26
+ return y({
27
+ orientation: c.ORIENTATION.VERTICAL,
28
+ itemsType: c.ITEMS_TYPE.CART_ITEMS,
29
29
  itemId: "{{Abandoned Cart Item (1) Url}}",
30
- currencySymbol: e.productPriceCurrencySymbolControlValue,
31
- currencyLocation: e.productPriceCurrencyLocationControlValue,
32
- formattedPrice: e.productPriceFormattedControlValue === "1"
30
+ currencySymbol: o.productPriceCurrencySymbolControlValue,
31
+ currencyLocation: o.productPriceCurrencyLocationControlValue,
32
+ formattedPrice: o.productPriceFormattedControlValue === "1"
33
33
  });
34
34
  }
35
35
  allowInnerBlocksDND() {
36
36
  return !1;
37
37
  }
38
- onCreated(r) {
39
- const n = r.querySelector("esd-config-block");
40
- if (!n)
38
+ onCreated(i) {
39
+ const e = C(i);
40
+ if (!e)
41
41
  return;
42
- const o = n, s = o.getAttribute("data-initialized") || "0", u = o.getAttribute(t.BLOCK_INSTANCE_ID), c = () => String(Date.now() + Math.floor(Math.random() * 1e3));
43
- if (Number(s)) {
44
- if (!u) {
45
- const i = c();
46
- this.api.getDocumentModifier().modifyHtml(o).setAttribute(t.BLOCK_INSTANCE_ID, i).apply(new a("Assign block instance ID to legacy block"));
47
- }
48
- } else {
49
- const i = e.itemsType, I = e.cartItemsSelectControlValue, d = e.cardOrientationControlValue, m = e.productNameTrimmingControlValue, C = e.productPriceHideDiscountControlValue, b = e.productPriceFormattedControlValue, T = e.productPriceCurrencySymbolControlValue, A = e.productPriceCurrencyLocationControlValue, E = e.productButtonLinkControlValue, O = e.productImageLinkControlValue, _ = e.productImageVisible, p = e.productNameVisible, N = e.productQuantityVisible, f = e.productPriceVisible, g = e.productOriginalPriceVisible, D = e.productButtonVisible, P = c();
50
- this.api.getDocumentModifier().modifyHtml(o).setAttribute("data-source", i).setAttribute(t.TYPE, i).setAttribute(t.ITEMS_INDEX_SELECT_CONTROL_VALUE, I).setAttribute(t.ORIENTATION, d).setAttribute(t.PRODUCT_NAME_TRIMMING, m).setAttribute(t.PRODUCT_PRICE_HIDE_DISCOUNT, C).setAttribute(t.PRODUCT_PRICE_FORMATTED, b).setAttribute(t.PRODUCT_PRICE_CURRENCY_SYMBOL, T).setAttribute(t.PRODUCT_PRICE_CURRENCY_LOCATION, A).setAttribute(t.PRODUCT_BUTTON_LINK, E).setAttribute(t.PRODUCT_IMAGE_LINK, O).setAttribute(t.BLOCK_INSTANCE_ID, P).setAttribute("data-initialized", "1").setAttribute(t.NAME_CONTROL_ENABLED, e.productNameControlEnabled).setAttribute(
51
- t.QUANTITY_CONTROL_ENABLED,
52
- e.productQuantityControlEnabled
53
- ).setAttribute(t.PRICE_CONTROL_OPENED, e.productPriceControlOpened).setAttribute(t.PRODUCT_IMAGE_VISIBLE, _).setAttribute(t.PRODUCT_NAME_VISIBLE, p).setAttribute(t.PRODUCT_QUANTITY_VISIBLE, N).setAttribute(t.PRODUCT_PRICE_VISIBLE, f).setAttribute(t.PRODUCT_ORIGINAL_PRICE_VISIBLE, g).setAttribute(t.PRODUCT_BUTTON_VISIBLE, D).apply(new a("Initialize config block attributes with defaults")), y().startOnboarding("itemsOnboarding");
42
+ const t = e.getNodeConfig(), l = t && Object.keys(t).length > 0, r = a(i);
43
+ if (r != null && r.initialized)
44
+ l ? r.blockInstanceId || this.api.getDocumentModifier().modifyHtml(e).setNodeConfig({ ...r, blockInstanceId: String(Date.now()) }).apply(new n("Assign block instance ID to block")) : this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(r).apply(new n("Migrate legacy esd-config-block to nodeConfig"));
45
+ else {
46
+ const m = I();
47
+ this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(m).apply(new n("Initialize Items block with default configuration")), d().startOnboarding("itemsOnboarding");
54
48
  }
49
+ const s = `[esd-extension-block-id="${f.IMAGE}"] img`;
50
+ this.api.getDocumentModifier().modifyHtml(i.querySelector(s)).setStyle("object-fit", "contain").apply(new n("Updated image object-fit"));
55
51
  }
56
- onSelect(r) {
57
- const n = r.querySelector("esd-config-block"), o = S();
58
- if (!n)
59
- return;
60
- const s = n, u = s.getAttribute(t.TYPE) || e.itemsType, c = s.getAttribute(t.ITEMS_INDEX_SELECT_CONTROL_VALUE) || e.cartItemsSelectControlValue, i = s.getAttribute(t.ORIENTATION) || e.cardOrientationControlValue;
61
- o.setItemsType(u), o.setItemIds(c), o.setOrientation(i), B(r), U(r), k(r);
52
+ onSelect(i) {
53
+ const e = g(), t = a(i);
54
+ t && (e.setItemsType(t.type || o.itemsType), e.setItemIds(t.itemsSelectValue || o.cartItemsSelectControlValue), e.setOrientation(t.orientation || o.cardOrientationControlValue), e.setCurrencySymbol(
55
+ t.priceCurrencySymbol || o.productPriceCurrencySymbolControlValue
56
+ ), e.setCurrencyLocation(
57
+ t.priceCurrencyLocation || o.productPriceCurrencyLocationControlValue
58
+ ), e.setFormattedPrice(
59
+ t.priceFormatted ?? o.productPriceFormattedControlValue === "1"
60
+ ));
62
61
  }
63
62
  }
64
63
  export {
65
- M as BLOCK_ID,
66
- x as ItemsBlock
64
+ b as BLOCK_ID,
65
+ O as ItemsBlock
67
66
  };
@@ -1,32 +1,32 @@
1
1
  var r = Object.defineProperty;
2
- var a = (o, e, t) => e in o ? r(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
3
- var s = (o, e, t) => a(o, typeof e != "symbol" ? e + "" : e, t);
2
+ var a = (n, e, t) => e in n ? r(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
3
+ var i = (n, e, t) => a(n, typeof e != "symbol" ? e + "" : e, t);
4
4
  import { CommonControl as u } from "../../../common-control.js";
5
5
  import { ItemsBlockControlId as d } from "../../enums/controlEnums.js";
6
6
  import { useItemsBlockStore as l } from "../../store/items-block.js";
7
7
  import { syncButtonLinkFromAttributes as h } from "../../utils/syncAttributesFromConfigBlock.js";
8
8
  import { updateConfigBlockAttributes as m } from "../../utils/updateAttributes.js";
9
- const i = d.BUTTON_LINK, n = {
9
+ const s = d.BUTTON_LINK, o = {
10
10
  LINK: "link"
11
11
  };
12
12
  class C extends u {
13
13
  constructor() {
14
14
  super(...arguments);
15
- s(this, "store", l());
15
+ i(this, "store", l());
16
16
  }
17
17
  getId() {
18
- return i;
18
+ return s;
19
19
  }
20
20
  getTemplate() {
21
21
  return `
22
- <div class="${i}">
22
+ <div class="container ${s}">
23
23
  ${this._getLink()}
24
24
  </div>
25
25
  `;
26
26
  }
27
27
  onRender() {
28
28
  this.api.updateValues({
29
- [n.LINK]: this.store.buttonLink
29
+ [o.LINK]: this.store.buttonLink
30
30
  }), this._listenToFormUpdates();
31
31
  }
32
32
  onTemplateNodeUpdated(t) {
@@ -34,14 +34,14 @@ class C extends u {
34
34
  () => h(this.currentNode),
35
35
  () => {
36
36
  this.api.updateValues({
37
- [n.LINK]: this.store.buttonLink
37
+ [o.LINK]: this.store.buttonLink
38
38
  });
39
39
  }
40
40
  );
41
41
  }
42
42
  _listenToFormUpdates() {
43
43
  this.api.onValueChanged(
44
- n.LINK,
44
+ o.LINK,
45
45
  (t) => this._onLinkChange(t)
46
46
  );
47
47
  }
@@ -53,7 +53,7 @@ class C extends u {
53
53
  ${this._GuOneColumn([
54
54
  this._GuLabel({ text: "Link" }),
55
55
  this._GuTextInput({
56
- name: n.LINK,
56
+ name: o.LINK,
57
57
  placeholder: "Enter Link",
58
58
  className: "es-100",
59
59
  disabled: !0
@@ -64,5 +64,5 @@ class C extends u {
64
64
  }
65
65
  export {
66
66
  C as ButtonLinkControl,
67
- i as CONTROL_BLOCK_ID
67
+ s as CONTROL_BLOCK_ID
68
68
  };