@useinsider/guido 2.0.0-beta.dd0d492 → 2.0.0-beta.faa7c5d

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 (84) hide show
  1. package/README.md +2 -0
  2. package/dist/@types/config/schemas.js +55 -39
  3. package/dist/components/Guido.vue.js +1 -1
  4. package/dist/components/Guido.vue2.js +15 -17
  5. package/dist/components/organisms/email-preview/desktop-preview/DesktopPreview.vue.js +2 -2
  6. package/dist/components/organisms/email-preview/mobile-preview/ContentView.vue.js +5 -5
  7. package/dist/components/organisms/header/LeftSlot.vue.js +12 -12
  8. package/dist/components/organisms/header/LeftSlot.vue2.js +6 -6
  9. package/dist/components/organisms/header/RightSlot.vue2.js +10 -10
  10. package/dist/composables/useConfig.js +29 -27
  11. package/dist/composables/useSave.js +13 -11
  12. package/dist/composables/useStripo.js +40 -40
  13. package/dist/config/migrator/index.js +9 -8
  14. package/dist/config/migrator/itemsBlockMigrator.js +342 -0
  15. package/dist/extensions/Blocks/CouponBlock/constants.js +4 -0
  16. package/dist/extensions/Blocks/CouponBlock/controls/index.js +29 -0
  17. package/dist/extensions/Blocks/CouponBlock/extension.js +5 -4
  18. package/dist/extensions/Blocks/CouponBlock/settingsPanel.js +20 -14
  19. package/dist/extensions/Blocks/CouponBlock/template.js +22 -11
  20. package/dist/extensions/Blocks/Items/block.js +39 -40
  21. package/dist/extensions/Blocks/Items/controls/button/link.js +22 -29
  22. package/dist/extensions/Blocks/Items/controls/cardComposition.js +66 -46
  23. package/dist/extensions/Blocks/Items/controls/image/link.js +23 -30
  24. package/dist/extensions/Blocks/Items/controls/name/trimming.js +25 -25
  25. package/dist/extensions/Blocks/Items/controls/price/currencyLocation.js +19 -17
  26. package/dist/extensions/Blocks/Items/controls/price/currencySymbol.js +31 -29
  27. package/dist/extensions/Blocks/Items/controls/price/formattedPrice.js +36 -36
  28. package/dist/extensions/Blocks/Items/controls/price/hideDiscount.js +21 -19
  29. package/dist/extensions/Blocks/Items/controls/price/priceOrientation.js +29 -27
  30. package/dist/extensions/Blocks/Items/controls/price/singlePrice.js +93 -0
  31. package/dist/extensions/Blocks/Items/controls/settingsControl.js +152 -143
  32. package/dist/extensions/Blocks/Items/enums/controlEnums.js +2 -2
  33. package/dist/extensions/Blocks/Items/enums/productEnums.js +43 -45
  34. package/dist/extensions/Blocks/Items/enums/settingsEnums.js +4 -3
  35. package/dist/extensions/Blocks/Items/extension.js +7 -6
  36. package/dist/extensions/Blocks/Items/layouts/horizontal.html.js +58 -49
  37. package/dist/extensions/Blocks/Items/layouts/vertical.html.js +48 -59
  38. package/dist/extensions/Blocks/Items/settingsPanel.js +27 -26
  39. package/dist/extensions/Blocks/Items/store/items-block.js +11 -7
  40. package/dist/extensions/Blocks/Items/template.js +366 -129
  41. package/dist/extensions/Blocks/Items/utils/nodeConfigUtils.js +184 -0
  42. package/dist/extensions/Blocks/Recommendation/control.js +1 -1
  43. package/dist/extensions/Blocks/Unsubscribe/extension.js +9 -9
  44. package/dist/extensions/Blocks/common-control.js +29 -30
  45. package/dist/extensions/Blocks/controlFactories.js +139 -118
  46. package/dist/guido.css +1 -1
  47. package/dist/node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js +370 -286
  48. package/dist/package.json.js +1 -1
  49. package/dist/services/stripoApi.js +6 -10
  50. package/dist/src/@types/config/index.d.ts +2 -2
  51. package/dist/src/@types/config/schemas.d.ts +30 -0
  52. package/dist/src/@types/config/types.d.ts +7 -1
  53. package/dist/src/composables/useConfig.d.ts +8 -0
  54. package/dist/src/config/migrator/itemsBlockMigrator.d.ts +6 -0
  55. package/dist/src/extensions/Blocks/CouponBlock/constants.d.ts +14 -0
  56. package/dist/src/extensions/Blocks/CouponBlock/controls/index.d.ts +108 -0
  57. package/dist/src/extensions/Blocks/CouponBlock/template.d.ts +1 -1
  58. package/dist/src/extensions/Blocks/Items/controls/button/link.d.ts +0 -2
  59. package/dist/src/extensions/Blocks/Items/controls/cardComposition.d.ts +9 -0
  60. package/dist/src/extensions/Blocks/Items/controls/image/link.d.ts +0 -2
  61. package/dist/src/extensions/Blocks/Items/controls/price/priceOrientation.d.ts +1 -1
  62. package/dist/src/extensions/Blocks/Items/controls/price/singlePrice.d.ts +18 -0
  63. package/dist/src/extensions/Blocks/Items/controls/settingsControl.d.ts +0 -4
  64. package/dist/src/extensions/Blocks/Items/enums/controlEnums.d.ts +1 -0
  65. package/dist/src/extensions/Blocks/Items/enums/productEnums.d.ts +24 -26
  66. package/dist/src/extensions/Blocks/Items/enums/settingsEnums.d.ts +1 -0
  67. package/dist/src/extensions/Blocks/Items/store/items-block.d.ts +2 -0
  68. package/dist/src/extensions/Blocks/Items/template.d.ts +22 -1
  69. package/dist/src/extensions/Blocks/Items/utils/nodeConfigUtils.d.ts +73 -0
  70. package/dist/src/extensions/Blocks/common-control.d.ts +9 -10
  71. package/dist/src/extensions/Blocks/controlFactories.d.ts +30 -7
  72. package/dist/src/stores/config.d.ts +164 -1
  73. package/dist/static/styles/components/button.css.js +1 -1
  74. package/dist/stores/config.js +7 -0
  75. package/dist/utils/pairProductVariables.js +61 -58
  76. package/package.json +3 -3
  77. package/dist/extensions/Blocks/Items/utils/configBlockUtils.js +0 -17
  78. package/dist/extensions/Blocks/Items/utils/syncAttributeFromConfigBlock.js +0 -28
  79. package/dist/extensions/Blocks/Items/utils/syncAttributesFromConfigBlock.js +0 -76
  80. package/dist/extensions/Blocks/Items/utils/updateAttributes.js +0 -46
  81. package/dist/src/extensions/Blocks/Items/utils/configBlockUtils.d.ts +0 -23
  82. package/dist/src/extensions/Blocks/Items/utils/syncAttributeFromConfigBlock.d.ts +0 -32
  83. package/dist/src/extensions/Blocks/Items/utils/syncAttributesFromConfigBlock.d.ts +0 -50
  84. package/dist/src/extensions/Blocks/Items/utils/updateAttributes.d.ts +0 -8
@@ -0,0 +1,184 @@
1
+ import { ModificationDescription as b } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
+ import { DefaultConfigValues as r, SETTINGS_ENUMS as n, ItemInCartOptions as g } from "../enums/settingsEnums.js";
3
+ function d() {
4
+ return String(Date.now() + Math.floor(Math.random() * 1e3));
5
+ }
6
+ function f() {
7
+ return {
8
+ initialized: !0,
9
+ blockInstanceId: d(),
10
+ source: n.ITEMS_TYPE.CART_ITEMS,
11
+ type: n.ITEMS_TYPE.CART_ITEMS,
12
+ itemsSelectValue: r.cartItemsSelectControlValue,
13
+ orientation: n.ORIENTATION.VERTICAL,
14
+ nameTrimming: r.productNameTrimmingControlValue === "1",
15
+ nameControlEnabled: r.productNameControlEnabled === "1",
16
+ priceHideDiscount: r.productPriceHideDiscountControlValue === "1",
17
+ priceFormatted: r.productPriceFormattedControlValue === "1",
18
+ priceSinglePrice: !1,
19
+ priceCurrencySymbol: r.productPriceCurrencySymbolControlValue,
20
+ priceCurrencyLocation: r.productPriceCurrencyLocationControlValue,
21
+ priceControlOpened: r.productPriceControlOpened === "1",
22
+ priceOrientation: "horizontal",
23
+ quantityControlEnabled: r.productQuantityControlEnabled === "1",
24
+ buttonLink: r.productButtonLinkControlValue,
25
+ imageLink: r.productImageLinkControlValue,
26
+ buttonLabel: "Buy",
27
+ buttonFullWidth: !0,
28
+ // Default to full width (es-fw class)
29
+ imageVisible: r.productImageVisible === "1",
30
+ nameVisible: r.productNameVisible === "1",
31
+ quantityVisible: r.productQuantityVisible === "1",
32
+ priceVisible: r.productPriceVisible === "1",
33
+ originalPriceVisible: r.productOriginalPriceVisible === "1",
34
+ buttonVisible: r.productButtonVisible === "1"
35
+ };
36
+ }
37
+ function p(o) {
38
+ if (!o)
39
+ return null;
40
+ const t = o.closest(".items-block-v2");
41
+ return t || o.closest(".esd-cart-items-block");
42
+ }
43
+ function m(o) {
44
+ return o ? {
45
+ CartItems: n.ITEMS_TYPE.CART_ITEMS,
46
+ BrowsedItems: n.ITEMS_TYPE.BROWSED_ITEMS,
47
+ PurchasedItems: n.ITEMS_TYPE.PURCHASED_ITEMS,
48
+ // Also handle already correct formats
49
+ CART_ITEMS: n.ITEMS_TYPE.CART_ITEMS,
50
+ BROWSED_ITEMS: n.ITEMS_TYPE.BROWSED_ITEMS,
51
+ PURCHASED_ITEMS: n.ITEMS_TYPE.PURCHASED_ITEMS
52
+ }[o] || n.ITEMS_TYPE.CART_ITEMS : n.ITEMS_TYPE.CART_ITEMS;
53
+ }
54
+ function C(o, t) {
55
+ if (!o)
56
+ return r.cartItemsSelectControlValue;
57
+ if (o.includes("{{"))
58
+ return o;
59
+ if (/^\d+$/.test(o)) {
60
+ const e = parseInt(o) - 1, i = g[t];
61
+ if (i && i[e])
62
+ return i[e].value;
63
+ }
64
+ return r.cartItemsSelectControlValue;
65
+ }
66
+ function I(o) {
67
+ const t = o.querySelector("esd-config-block");
68
+ if (!t)
69
+ return null;
70
+ const e = (c, a) => c == null ? a : c === "1" || c === "true", i = (c, a) => c || a, l = t.getAttribute("data-type"), u = m(l), s = t.getAttribute("data-cart_items_select_control_value"), _ = C(s, u);
71
+ return {
72
+ initialized: e(t.getAttribute("data-initialized"), !1),
73
+ blockInstanceId: i(
74
+ t.getAttribute("data-block-instance-id"),
75
+ d()
76
+ ),
77
+ source: u,
78
+ type: u,
79
+ itemsSelectValue: _,
80
+ orientation: t.getAttribute("data-card_orientation_control_value") || n.ORIENTATION.VERTICAL,
81
+ nameTrimming: e(
82
+ t.getAttribute("data-product_name_control_trim"),
83
+ !0
84
+ ),
85
+ nameControlEnabled: e(
86
+ t.getAttribute("data-product_name_control_enabled"),
87
+ !0
88
+ ),
89
+ priceHideDiscount: e(
90
+ t.getAttribute("data-product_price_control_nodup"),
91
+ !0
92
+ ),
93
+ priceFormatted: e(
94
+ t.getAttribute("data-product_price_control_formated"),
95
+ !0
96
+ ),
97
+ priceSinglePrice: e(
98
+ t.getAttribute("data-product_price_control_single_price"),
99
+ !1
100
+ ),
101
+ priceCurrencySymbol: i(
102
+ t.getAttribute("data-product_price_currency_symbol"),
103
+ r.productPriceCurrencySymbolControlValue
104
+ ),
105
+ priceCurrencyLocation: i(
106
+ t.getAttribute("data-product_price_currency_location"),
107
+ r.productPriceCurrencyLocationControlValue
108
+ ),
109
+ priceControlOpened: e(
110
+ t.getAttribute("data-product_price_control_opened"),
111
+ !0
112
+ ),
113
+ priceOrientation: t.getAttribute("data-product_original_price_control_orientation") || "horizontal",
114
+ quantityControlEnabled: e(
115
+ t.getAttribute("data-product_quantity_control_enabled"),
116
+ !0
117
+ ),
118
+ buttonLink: i(
119
+ t.getAttribute("data-product_button_link"),
120
+ r.productButtonLinkControlValue
121
+ ),
122
+ imageLink: i(
123
+ t.getAttribute("data-product_image_link"),
124
+ r.productImageLinkControlValue
125
+ ),
126
+ buttonLabel: i(
127
+ t.getAttribute("data-product_button_control_label"),
128
+ "Buy"
129
+ ),
130
+ buttonFullWidth: e(
131
+ t.getAttribute("data-product_button_control_atw"),
132
+ !0
133
+ // Default to full width
134
+ ),
135
+ imageVisible: e(
136
+ t.getAttribute("data-product_image_control_enabled"),
137
+ !0
138
+ ),
139
+ nameVisible: e(
140
+ t.getAttribute("data-product_name_control_enabled"),
141
+ !0
142
+ ),
143
+ quantityVisible: e(
144
+ t.getAttribute("data-product_quantity_visible"),
145
+ !0
146
+ ),
147
+ priceVisible: e(
148
+ t.getAttribute("data-product_price_visible"),
149
+ !0
150
+ ),
151
+ originalPriceVisible: e(
152
+ t.getAttribute("data-product_original_price_control_enabled"),
153
+ !0
154
+ ),
155
+ buttonVisible: e(
156
+ t.getAttribute("data-product_button_visible"),
157
+ !0
158
+ )
159
+ };
160
+ }
161
+ function S(o) {
162
+ const t = p(o);
163
+ if (!t)
164
+ return null;
165
+ const e = t.getNodeConfig();
166
+ if (e && e.initialized)
167
+ return e;
168
+ const i = I(t);
169
+ return i || null;
170
+ }
171
+ function A(o, t, e) {
172
+ const i = p(o);
173
+ if (!i)
174
+ return;
175
+ const u = { ...i.getNodeConfig() || {}, ...e };
176
+ t.getDocumentModifier().modifyHtml(i).setNodeConfig(u).apply(new b("Update Items block configuration"));
177
+ }
178
+ export {
179
+ d as generateBlockInstanceId,
180
+ f as getDefaultItemsBlockConfig,
181
+ S as getItemsBlockConfig,
182
+ p as getItemsBlockContainer,
183
+ A as setItemsBlockConfig
184
+ };
@@ -289,7 +289,7 @@ class b extends g {
289
289
  t.CURRENCY_DECIMAL_COUNT
290
290
  ].forEach((i) => {
291
291
  this.api.onValueChanged(i, (a) => this._onCurrencyConfigChange(i, a));
292
- }), this.api.onValueChanged(t.PRODUCT_COUNT, (i) => this._onDataChange(t.PRODUCT_COUNT, i.toString())), this.api.onValueChanged(t.PRODUCT_IN_ROW, (i) => this._onDataChange(t.PRODUCT_IN_ROW, i)), this.api.onValueChanged(t.SHUFFLE_PRODUCTS, (i) => this._onDataChange(t.SHUFFLE_PRODUCTS, i)), this.api.onValueChanged(t.RESPONSIVE, (i) => this._onDataChange(t.RESPONSIVE, i)), this.addFilterListener = this._onFilterSelectClick.bind(this), this.addFilterButton = this.getContainer().querySelector("#guido__btn-add-filter"), (o = this.addFilterButton) == null || o.addEventListener("click", this.addFilterListener);
292
+ }), this.api.onValueChanged(t.PRODUCT_COUNT, (i) => this._onDataChange(t.PRODUCT_COUNT, String(i))), this.api.onValueChanged(t.PRODUCT_IN_ROW, (i) => this._onDataChange(t.PRODUCT_IN_ROW, i)), this.api.onValueChanged(t.SHUFFLE_PRODUCTS, (i) => this._onDataChange(t.SHUFFLE_PRODUCTS, i)), this.api.onValueChanged(t.RESPONSIVE, (i) => this._onDataChange(t.RESPONSIVE, i)), this.addFilterListener = this._onFilterSelectClick.bind(this), this.addFilterButton = this.getContainer().querySelector("#guido__btn-add-filter"), (o = this.addFilterButton) == null || o.addEventListener("click", this.addFilterListener);
293
293
  }
294
294
  _listenStateUpdates() {
295
295
  this.storeUnsubscription = this.store.$subscribe((e) => {
@@ -1,21 +1,21 @@
1
1
  import { ExtensionBuilder as e } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
2
  import { UnsubscribeBlock as i } from "./block.js";
3
3
  import { UnsubscribeControl as t } from "./control.js";
4
- import { PreviewUIElement as o } from "./elements/preview.js";
5
- import { UnsubscribeIconsRegistry as r } from "./iconsRegistry.js";
6
- import { SettingsPanel as s } from "./settingsPanel.js";
4
+ import { PreviewUIElement as s } from "./elements/preview.js";
5
+ import { UnsubscribeIconsRegistry as o } from "./iconsRegistry.js";
6
+ import { SettingsPanel as r } from "./settingsPanel.js";
7
7
  import n from "./styles.css.js";
8
- import { UnsubscribeTagRegistry as l } from "./tagRegistry.js";
9
- const f = new e().addBlock(i).withSettingsPanelRegistry(s).addControl(t).addUiElement(o).addStyles(n).withLocalization({
8
+ import { UnsubscribeTagRegistry as c } from "./tagRegistry.js";
9
+ const g = new e().addBlock(i).withSettingsPanelRegistry(r).addControl(t).addUiElement(s).addStyles(n).withLocalization({
10
10
  en: {
11
- "Unsubscribe Block": "Unsubscribe Block",
12
- "Unsubscribe Block Description": "Add an unsubscribe link to your email",
11
+ "Unsubscribe Block": "Unsubscribe",
12
+ "Unsubscribe Block Description": "Unsubscribe lets you add an Unsubscribe Link to direct users to opt out of receiving your messages.",
13
13
  "Select Template": "Select Template",
14
14
  "Unsubscribe Template": "Unsubscribe Template",
15
15
  Showing: "Showing",
16
16
  of: "of"
17
17
  }
18
- }).withUiElementTagRegistry(l).withIconsRegistry(r).build();
18
+ }).withUiElementTagRegistry(c).withIconsRegistry(o).build();
19
19
  export {
20
- f as default
20
+ g as default
21
21
  };
@@ -1,12 +1,12 @@
1
- var c = Object.defineProperty;
2
- var I = (a, r, e) => r in a ? c(a, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : a[r] = e;
3
- var l = (a, r, e) => I(a, typeof r != "symbol" ? r + "" : r, e);
1
+ var I = Object.defineProperty;
2
+ var c = (T, r, e) => r in T ? I(T, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : T[r] = e;
3
+ var u = (T, r, e) => c(T, typeof r != "symbol" ? r + "" : r, e);
4
4
  import { Control as O, UIElementType as t, UEAttr as $ } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
5
5
  class _ extends O {
6
6
  constructor() {
7
7
  super(...arguments);
8
- l(this, "currentNode");
9
- l(this, "lastBlockInstanceId", null);
8
+ u(this, "currentNode");
9
+ u(this, "lastBlockInstanceId", null);
10
10
  }
11
11
  getContainer() {
12
12
  var e;
@@ -19,38 +19,37 @@ class _ extends O {
19
19
  this.lastBlockInstanceId = null;
20
20
  }
21
21
  /**
22
- * Gets the config block element from the current node.
23
- * @returns The config block element or null if not found
22
+ * Gets the Items block container element from the current node.
23
+ * @returns The container element or null if not found
24
24
  */
25
- getConfigBlock() {
26
- if (!this.currentNode)
27
- return null;
28
- const e = this.currentNode.closest(".items-block-v2");
29
- return e ? e.querySelector("esd-config-block") : null;
25
+ getItemsBlockContainer() {
26
+ return this.currentNode ? this.currentNode.closest(".items-block-v2") : null;
30
27
  }
31
28
  /**
32
- * Gets the current block instance ID from the config block.
33
- * @param blockInstanceIdAttribute - The attribute name for block instance ID (default: 'data-block-instance-id')
29
+ * Gets the current block instance ID from the node config (Stripo V2).
34
30
  * @returns The block instance ID or null if not found
35
31
  */
36
- getBlockInstanceId(e = "data-block-instance-id") {
37
- const n = this.getConfigBlock();
38
- return n ? n.getAttribute(e) : null;
32
+ getBlockInstanceId() {
33
+ const e = this.getItemsBlockContainer();
34
+ if (!e)
35
+ return null;
36
+ const n = e.getNodeConfig();
37
+ return n && typeof n.blockInstanceId == "string" ? n.blockInstanceId : null;
39
38
  }
40
39
  /**
41
40
  * Handles block instance change detection and syncing.
42
- * This is a helper method for controls that need to sync attributes when switching between block instances.
43
- * @param syncFunction - Function to call when block instance changes (to sync from attributes)
41
+ * This is a helper method for controls that need to sync config when switching between block instances.
42
+ * Uses Stripo V2 nodeConfig API for block instance tracking.
43
+ * @param syncFunction - Function to call when block instance changes (to sync from node config)
44
44
  * @param updateUI - Function to call to update the UI (called both on change and when same block)
45
- * @param blockInstanceIdAttribute - The attribute name for block instance ID (default: 'data-block-instance-id')
46
45
  * @returns true if block instance changed, false otherwise
47
46
  */
48
- handleBlockInstanceChange(e, n, E = "data-block-instance-id") {
49
- const o = this.getBlockInstanceId(E);
50
- if (!o)
47
+ handleBlockInstanceChange(e, n) {
48
+ const E = this.getBlockInstanceId();
49
+ if (!E)
51
50
  return !1;
52
- const T = o !== this.lastBlockInstanceId;
53
- return T ? (this.currentNode && e(this.currentNode), n(), this.lastBlockInstanceId = o) : n(), T;
51
+ const o = E !== this.lastBlockInstanceId;
52
+ return o ? (this.currentNode && e(this.currentNode), n(), this.lastBlockInstanceId = E) : n(), o;
54
53
  }
55
54
  _GuLabel({ text: e, name: n = "", position: E = "top" }) {
56
55
  return `
@@ -81,7 +80,7 @@ class _ extends O {
81
80
  class="${o}"
82
81
  ${$.SELECTPICKER.name}="${e}"
83
82
  ${$.SELECTPICKER.placeholder}="${n}">
84
- ${E.map((T) => this._GuSelectItem(T)).join("")}
83
+ ${E.map((a) => this._GuSelectItem(a)).join("")}
85
84
  </${t.SELECTPICKER}>
86
85
  `;
87
86
  }
@@ -169,11 +168,11 @@ class _ extends O {
169
168
  */
170
169
  _GuOrderable(e, n) {
171
170
  let E = "";
172
- n.forEach((T) => {
173
- const u = $.ORDERABLE_ITEM && "name" in $.ORDERABLE_ITEM ? $.ORDERABLE_ITEM.name : "name";
171
+ n.forEach((a) => {
172
+ const l = $.ORDERABLE_ITEM && "name" in $.ORDERABLE_ITEM ? $.ORDERABLE_ITEM.name : "name";
174
173
  E += `
175
- <${t.ORDERABLE_ITEM} ${u}="${T.key}">
176
- ${T.content}
174
+ <${t.ORDERABLE_ITEM} ${l}="${a.key}">
175
+ ${a.content}
177
176
  </${t.ORDERABLE_ITEM}>
178
177
  `;
179
178
  });