@useinsider/guido 3.3.0-beta.6d597b3 → 3.3.0-beta.86ea9cd

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,5 +1,5 @@
1
1
  import { ModuleFolderDefaults as S } from "../../enums/defaults.js";
2
- import { object as o, number as n, optional as e, string as t, picklist as l, pipe as p, minLength as b, custom as h, boolean as a, array as c, record as k, literal as i, looseObject as y, variant as g, union as f, unknown as s } from "../../node_modules/valibot/dist/index.js";
2
+ import { object as o, number as n, optional as e, string as t, pipe as p, picklist as l, minLength as b, custom as h, boolean as a, array as c, record as k, looseObject as y, literal as i, variant as g, union as f, unknown as s } from "../../node_modules/valibot/dist/index.js";
3
3
  const d = {
4
4
  /** Promotional/marketing emails */
5
5
  PROMOTIONAL: 1,
@@ -1,5 +1,5 @@
1
1
  import { useDebounce as p } from "./useDebounce.js";
2
- import { ResponsivePreviewRegex as c, ResponsivePreviewConfig as a, ResponsivePreviewSelectors as v } from "../enums/preview.js";
2
+ import { ResponsivePreviewRegex as c, ResponsivePreviewSelectors as v, ResponsivePreviewConfig as a } from "../enums/preview.js";
3
3
  let i = null, l = null;
4
4
  const { debounce: y } = p(), h = (t) => {
5
5
  if (!t)
@@ -1,33 +1,33 @@
1
- var I = Object.defineProperty;
2
- var k = (r, n, t) => n in r ? I(r, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[n] = t;
3
- var u = (r, n, t) => k(r, typeof n != "symbol" ? n + "" : n, t);
4
- import { BlockId as _ } from "../../../enums/block.js";
5
- import { getMigrationBannerHtml as B } from "../../../utils/migrationBannerHtml.js";
6
- import { Block as b, BlockCompositionType as R, ModificationDescription as y } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
7
- import { regenerateMobileProductRows as C } from "./controls/main/utils.js";
8
- import { ensureMobileCssRulesExist as g, setMobileLayoutOptOut as d, hasMobileLayoutOptOut as A } from "./controls/mobileLayout/cssRules.js";
9
- import { RecommendationConfigService as c } from "./services/configService.js";
10
- import { useRecommendationExtensionStore as p } from "./store/recommendation.js";
1
+ var k = Object.defineProperty;
2
+ var _ = (r, n, t) => n in r ? k(r, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[n] = t;
3
+ var g = (r, n, t) => _(r, typeof n != "symbol" ? n + "" : n, t);
4
+ import { BlockId as B } from "../../../enums/block.js";
5
+ import { getMigrationBannerHtml as b } from "../../../utils/migrationBannerHtml.js";
6
+ import { Block as R, BlockCompositionType as y, ModificationDescription as C } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
7
+ import { regenerateMobileProductRows as A } from "./controls/main/utils.js";
8
+ import { ensureMobileCssRulesExist as d, setMobileLayoutOptOut as p, hasMobileLayoutOptOut as D } from "./controls/mobileLayout/cssRules.js";
9
+ import { RecommendationConfigService as s } from "./services/configService.js";
10
+ import { useRecommendationExtensionStore as f } from "./store/recommendation.js";
11
11
  import { getDefaultTemplate as E } from "./templates/grid/template.js";
12
- const f = _.Recommendation, l = "recommendation-block-v2", m = "recommendation-id";
13
- let h = !1;
14
- class q extends b {
12
+ const h = B.Recommendation, l = "recommendation-block-v2", m = "recommendation-id";
13
+ let I = !1;
14
+ class v extends R {
15
15
  constructor() {
16
16
  super();
17
17
  /**
18
18
  * Stores the ID generated in getTemplate() so onCreated() can reuse it.
19
19
  * This avoids generating a new (different) ID in onCreated().
20
20
  */
21
- u(this, "_pendingBlockId", null);
21
+ g(this, "_pendingBlockId", null);
22
22
  }
23
23
  getId() {
24
- return f;
24
+ return h;
25
25
  }
26
26
  getIcon() {
27
27
  return "recommendation-icon";
28
28
  }
29
29
  getBlockCompositionType() {
30
- return R.CONTAINER;
30
+ return y.CONTAINER;
31
31
  }
32
32
  getName() {
33
33
  return this.api.translate("Recommendation Block");
@@ -38,8 +38,8 @@ class q extends b {
38
38
  );
39
39
  }
40
40
  getSettingsPanelTitleHtml() {
41
- return B(
42
- f,
41
+ return b(
42
+ h,
43
43
  this.api.translate("Recommendation Block"),
44
44
  this.api.translate("This block is switched from the Old Version to the New Version. We recommend you check the Recommendation block and test your message to ensure it works properly.")
45
45
  );
@@ -71,13 +71,20 @@ class q extends b {
71
71
  return;
72
72
  const i = this._pendingBlockId ?? this._generateNextId();
73
73
  this._pendingBlockId = null, this._assignRecommendationId(t, i);
74
- const o = c.initializeConfig(this.api, t, { recommendationId: i }), s = p();
75
- s.setCurrentBlock(i), g(this.api);
76
- const a = this._getBlockElement(t);
77
- a && (d(this.api, a, !0), C({
78
- currentNode: t,
79
- documentModifier: this.api.getDocumentModifier()
80
- })), s.patchCurrentBlockConfig({ language: o.language }, { triggerRefetch: !1 });
74
+ const { config: o, wasFreshDrop: c } = s.initializeConfig(
75
+ this.api,
76
+ t,
77
+ { recommendationId: i }
78
+ ), a = f();
79
+ if (a.setCurrentBlock(i), c) {
80
+ d(this.api);
81
+ const u = this._getBlockElement(t);
82
+ u && (p(this.api, u, !0), A({
83
+ currentNode: t,
84
+ documentModifier: this.api.getDocumentModifier()
85
+ }));
86
+ }
87
+ a.patchCurrentBlockConfig({ language: o.language }, { triggerRefetch: !1 });
81
88
  }
82
89
  /**
83
90
  * Called when the document changes or template is loaded
@@ -90,20 +97,20 @@ class q extends b {
90
97
  if (!(!t || !("getNodeConfig" in t))) {
91
98
  if (!this._getRecommendationId(t)) {
92
99
  const e = this._generateNextId();
93
- this._assignRecommendationId(t, e), c.hasConfig(t) && c.updateConfig(
100
+ this._assignRecommendationId(t, e), s.hasConfig(t) && s.updateConfig(
94
101
  this.api,
95
102
  t,
96
103
  { recommendationId: e },
97
104
  "Assign recommendation ID to legacy block"
98
105
  );
99
106
  }
100
- c.needsMigration(t) && this._migrateFromLegacy(t);
107
+ s.needsMigration(t) && this._migrateFromLegacy(t);
101
108
  try {
102
- h || (g(this.api), h = !0);
103
- const e = c.getConfig(t), i = this._getBlockElement(t);
109
+ I || (d(this.api), I = !0);
110
+ const e = s.getConfig(t), i = this._getBlockElement(t);
104
111
  if (i) {
105
112
  const o = !e.mobileLayoutEnabled;
106
- A(i) !== o && d(this.api, i, o);
113
+ D(i) !== o && p(this.api, i, o);
107
114
  }
108
115
  } catch {
109
116
  }
@@ -117,7 +124,7 @@ class q extends b {
117
124
  */
118
125
  onDelete(t) {
119
126
  const e = this._getRecommendationId(t);
120
- e && p().removeBlockState(e);
127
+ e && f().removeBlockState(e);
121
128
  }
122
129
  /**
123
130
  * Generates the next unique recommendation ID by scanning all existing blocks
@@ -129,7 +136,7 @@ class q extends b {
129
136
  const e = this.api.getDocumentRoot();
130
137
  e && "querySelectorAll" in e && e.querySelectorAll(`.${l}`).forEach((o) => {
131
138
  if ("getAttribute" in o) {
132
- const s = o.getAttribute(m), a = s ? parseInt(s) : 0;
139
+ const c = o.getAttribute(m), a = c ? parseInt(c) : 0;
133
140
  a > t && (t = a);
134
141
  }
135
142
  });
@@ -148,7 +155,7 @@ class q extends b {
148
155
  if (!i)
149
156
  return;
150
157
  const o = this.api.getDocumentModifier();
151
- o.modifyHtml(i).setAttribute(m, e.toString()), o.apply(new y(`Assign recommendation ID ${e}`));
158
+ o.modifyHtml(i).setAttribute(m, e.toString()), o.apply(new C(`Assign recommendation ID ${e}`));
152
159
  }
153
160
  /**
154
161
  * Gets the recommendation-id from a block node
@@ -178,10 +185,10 @@ class q extends b {
178
185
  * Migrate configuration from legacy format
179
186
  */
180
187
  _migrateFromLegacy(t) {
181
- c.migrateFromDataAttributes(this.api, t);
188
+ s.migrateFromDataAttributes(this.api, t);
182
189
  }
183
190
  }
184
191
  export {
185
- f as BLOCK_ID,
186
- q as RecommendationBlock
192
+ h as BLOCK_ID,
193
+ v as RecommendationBlock
187
194
  };
@@ -1,5 +1,5 @@
1
- import { ModificationDescription as h } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
- import { CURRENT_CONFIG_VERSION as l, DEFAULT_NODE_CONFIG as r } from "../constants/defaultConfig.js";
1
+ import { ModificationDescription as C } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
2
+ import { CURRENT_CONFIG_VERSION as l, DEFAULT_NODE_CONFIG as c } from "../constants/defaultConfig.js";
3
3
  import { setCurrencyAttributes as D } from "../controls/main/utils.js";
4
4
  import { hasMinimalConfig as A } from "../types/nodeConfig.js";
5
5
  function S(e) {
@@ -8,7 +8,7 @@ function S(e) {
8
8
  function N(e) {
9
9
  return e === "." || e === "," || e === " " || e === "";
10
10
  }
11
- class V {
11
+ class M {
12
12
  // ========================================================================
13
13
  // Read Operations
14
14
  // ========================================================================
@@ -83,7 +83,7 @@ class V {
83
83
  * @returns The new complete configuration
84
84
  */
85
85
  static updateConfig(i, t, o, n) {
86
- const c = this.getConfig(t), u = this.deepMerge(c, o);
86
+ const r = this.getConfig(t), u = this.deepMerge(r, o);
87
87
  return this.saveConfig(i, t, u, n), u;
88
88
  }
89
89
  /**
@@ -91,21 +91,28 @@ class V {
91
91
  *
92
92
  * Called when a block is first created (dropped into template).
93
93
  * Can optionally merge in partial config from migration.
94
+ *
95
+ * The `wasFreshDrop` flag distinguishes a brand-new drop (no prior config)
96
+ * from a clone (Stripo replays the source's setNodeConfig payload before
97
+ * onCreated fires). Callers use this to skip side-effects already inherited
98
+ * from the source.
94
99
  * @example
95
100
  * // In Block.onCreated lifecycle
96
- * RecommendationConfigService.initializeConfig(this.api, node);
101
+ * const { config, wasFreshDrop } = RecommendationConfigService.initializeConfig(this.api, node);
97
102
  * @param api - Stripo extension API with document modifier
98
103
  * @param node - The immutable HTML node to initialize
99
104
  * @param partialConfig - Optional partial config to merge with defaults
100
- * @returns The initialized configuration
105
+ * @returns The initialized configuration and whether the node was a fresh drop
101
106
  */
102
107
  static initializeConfig(i, t, o) {
108
+ if (this.hasConfig(t))
109
+ return { config: o ? this.updateConfig(i, t, o, "Initialize recommendation block") : this.getConfig(t), wasFreshDrop: !1 };
103
110
  const n = o ? this.mergeWithDefaults(o) : this.cloneDefaults();
104
111
  return this.saveConfig(i, t, n, "Initialize recommendation block"), D({
105
112
  currentNode: t,
106
113
  documentModifier: i.getDocumentModifier(),
107
114
  currency: n.currency
108
- }), n;
115
+ }), { config: n, wasFreshDrop: !0 };
109
116
  }
110
117
  /**
111
118
  * Save complete configuration to a node
@@ -118,9 +125,9 @@ class V {
118
125
  */
119
126
  static saveConfig(i, t, o, n) {
120
127
  try {
121
- i.getDocumentModifier().modifyHtml(t).setNodeConfig(o).apply(new h(n));
122
- } catch (c) {
123
- console.warn("[RecommendationConfigService] Failed to save config:", c);
128
+ i.getDocumentModifier().modifyHtml(t).setNodeConfig(o).apply(new C(n));
129
+ } catch (r) {
130
+ console.warn("[RecommendationConfigService] Failed to save config:", r);
124
131
  }
125
132
  }
126
133
  // ========================================================================
@@ -157,29 +164,29 @@ class V {
157
164
  s && typeof s == "object" && (Object.assign(o, s), o.configVersion = l);
158
165
  } catch {
159
166
  }
160
- const c = t.getAttribute("data-layout");
161
- c === "list" || c === "horizontal" ? o.layout = "list" : (c === "grid" || c === "vertical") && (o.layout = "grid");
167
+ const r = t.getAttribute("data-layout");
168
+ r === "list" || r === "horizontal" ? o.layout = "list" : (r === "grid" || r === "vertical") && (o.layout = "grid");
162
169
  const u = t.getAttribute("data-card-composition");
163
170
  u && (o.composition = u.split(",").filter(Boolean));
164
- const p = t.getAttribute("data-column-spacing");
165
- p && (o.columnSpacing = parseInt(p) || r.columnSpacing);
166
- const b = t.getAttribute("data-row-spacing");
167
- if (b && (o.rowSpacing = parseInt(b) || r.rowSpacing), !o.currency) {
171
+ const b = t.getAttribute("data-column-spacing");
172
+ b && (o.columnSpacing = parseInt(b) || c.columnSpacing);
173
+ const p = t.getAttribute("data-row-spacing");
174
+ if (p && (o.rowSpacing = parseInt(p) || c.rowSpacing), !o.currency) {
168
175
  const s = t.getAttribute("currency"), y = t.getAttribute("currency-symbol"), d = t.getAttribute("currency-alignment"), f = t.getAttribute("currency-thousand-separator"), g = t.getAttribute("currency-decimal-separator"), m = t.getAttribute("currency-decimal-count");
169
176
  if (s || y || d || f || g || m) {
170
- const a = r.currency, C = m ? parseInt(m) : NaN;
177
+ const a = c.currency, h = m ? parseInt(m) : NaN;
171
178
  o.currency = {
172
179
  code: s ?? a.code,
173
180
  symbol: y ?? a.symbol,
174
181
  alignment: d === "0" ? "before" : "after",
175
- decimalCount: Number.isFinite(C) ? C : a.decimalCount,
182
+ decimalCount: Number.isFinite(h) ? h : a.decimalCount,
176
183
  decimalSeparator: S(g) ? g : a.decimalSeparator,
177
184
  thousandSeparator: N(f) ? f : a.thousandSeparator
178
185
  };
179
186
  }
180
187
  }
181
188
  }
182
- return this.initializeConfig(i, t, o);
189
+ return this.initializeConfig(i, t, o).config;
183
190
  }
184
191
  /**
185
192
  * Check if configuration needs migration
@@ -197,12 +204,12 @@ class V {
197
204
  */
198
205
  static cloneDefaults() {
199
206
  return {
200
- ...r,
201
- currency: { ...r.currency },
202
- omnibusPrice: { ...r.omnibusPrice },
203
- omnibusDiscount: { ...r.omnibusDiscount },
204
- composition: [...r.composition],
205
- visibility: { ...r.visibility },
207
+ ...c,
208
+ currency: { ...c.currency },
209
+ omnibusPrice: { ...c.omnibusPrice },
210
+ omnibusDiscount: { ...c.omnibusDiscount },
211
+ composition: [...c.composition],
212
+ visibility: { ...c.visibility },
206
213
  filters: [],
207
214
  productIds: [],
208
215
  recommendationId: 0
@@ -272,5 +279,5 @@ class V {
272
279
  }
273
280
  }
274
281
  export {
275
- V as RecommendationConfigService
282
+ M as RecommendationConfigService
276
283
  };
@@ -2,7 +2,7 @@ import { RecommendationBlockId as s } from "../../constants/blockIds.js";
2
2
  import { ATTR_PRODUCT_ATTR as b, ATTR_PRODUCT_BUTTON as u, ATTR_PRODUCT_OMNIBUS_DISCOUNT as m, ATTR_PRODUCT_OMNIBUS_PRICE as h, ATTR_PRODUCT_OLD_PRICE as y, ATTR_PRODUCT_PRICE as T, ATTR_PRODUCT_NAME as f, ATTR_PRODUCT_IMAGE as x } from "../../constants/selectors.js";
3
3
  import { useRecommendationExtensionStore as _ } from "../../store/recommendation.js";
4
4
  import { formatPrice as $ } from "../../utils/priceFormatter.js";
5
- import { CUSTOM_CELL_HTML as C, sanitizeImageUrl as R } from "../utils.js";
5
+ import { sanitizeImageUrl as C, CUSTOM_CELL_HTML as R } from "../utils.js";
6
6
  const a = "0 5px", l = "attribute-cell";
7
7
  function p() {
8
8
  const t = _(), { currencySettings: e } = t.recommendationConfigs;
@@ -40,7 +40,7 @@ const I = {
40
40
  esd-extension-block-id="${s.IMAGE}">
41
41
  <a target="_blank" href="${t.url}">
42
42
  <img
43
- src="${R(t.image_url)}"
43
+ src="${C(t.image_url)}"
44
44
  alt="${t.name}"
45
45
  style="display: block; max-width: 100%; height: auto;"
46
46
  class="adapt-img">
@@ -236,7 +236,7 @@ const I = {
236
236
  * @param productAttrValue - Resolved product-attr value (e.g., "brand" for default, "product_attribute.rating_star" for custom)
237
237
  * @param content - Display content for the cell
238
238
  */
239
- [C]: (t, e) => `
239
+ [R]: (t, e) => `
240
240
  <td class="${l}" style="padding: ${a}; height: 100%;" valign="middle">
241
241
  <table
242
242
  class="product-card-segment"
@@ -1,5 +1,5 @@
1
1
  import { DEFAULT_PRODUCTS_PER_ROW as L } from "../../constants/layout.js";
2
- import { getDefaultProducts as E, DEFAULTS as I, createBlockTemplate as _, DEFAULT_CARD_COMPOSITION as S, spacer as b, buildElementRenderer as A, DEFAULT_CARD_VISIBILITY as f } from "../utils.js";
2
+ import { getDefaultProducts as E, createBlockTemplate as I, DEFAULTS as _, DEFAULT_CARD_COMPOSITION as S, spacer as b, buildElementRenderer as A, DEFAULT_CARD_VISIBILITY as f } from "../utils.js";
3
3
  import { ATTRIBUTE_CELL_CLASS as w, DEFAULT_CELL_PADDING as D, gridElementRenderer as C } from "./elementRenderer.js";
4
4
  const O = `
5
5
  <tr class="recommendation-product-row">
@@ -53,8 +53,8 @@ function h(t, e, o, r = {}) {
53
53
  return U(t, e, C, o, r);
54
54
  }
55
55
  function F(t) {
56
- const e = t ? `ins-recommendation-v3-block-${t}` : void 0, o = _("grid", e), r = E(), n = h(r, L);
57
- return o.replace("{-{-TITLE-}-}", I.TITLE).replace("{-{-PRODUCT_ROWS-}-}", n).replace("{-{-MOBILE_PRODUCT_ROWS-}-}", "");
56
+ const e = t ? `ins-recommendation-v3-block-${t}` : void 0, o = I("grid", e), r = E(), n = h(r, L);
57
+ return o.replace("{-{-TITLE-}-}", _.TITLE).replace("{-{-PRODUCT_ROWS-}-}", n).replace("{-{-MOBILE_PRODUCT_ROWS-}-}", "");
58
58
  }
59
59
  export {
60
60
  F as getDefaultTemplate,
@@ -2,7 +2,7 @@ import { RecommendationBlockId as o } from "../../constants/blockIds.js";
2
2
  import { ATTR_PRODUCT_ATTR as m, ATTR_PRODUCT_BUTTON as c, ATTR_PRODUCT_IMAGE as d, ATTR_PRODUCT_OMNIBUS_DISCOUNT as u, ATTR_PRODUCT_OMNIBUS_PRICE as g, ATTR_PRODUCT_OLD_PRICE as f, ATTR_PRODUCT_PRICE as T, ATTR_PRODUCT_NAME as x } from "../../constants/selectors.js";
3
3
  import { useRecommendationExtensionStore as _ } from "../../store/recommendation.js";
4
4
  import { formatPrice as R } from "../../utils/priceFormatter.js";
5
- import { CUSTOM_CELL_HTML as y, sanitizeImageUrl as C } from "../utils.js";
5
+ import { sanitizeImageUrl as y, CUSTOM_CELL_HTML as C } from "../utils.js";
6
6
  function p() {
7
7
  const t = _(), { currencySettings: e } = t.recommendationConfigs;
8
8
  return {
@@ -37,7 +37,7 @@ const U = {
37
37
  valign="middle">
38
38
  <a target="_blank" href="${t.url}">
39
39
  <img
40
- src="${C(t.image_url)}"
40
+ src="${y(t.image_url)}"
41
41
  alt="${t.name}"
42
42
  style="display: block; max-width: 100%; height: auto;"
43
43
  class="adapt-img product-image">
@@ -179,7 +179,7 @@ const U = {
179
179
  * @param productAttrValue - Resolved product-attr value (e.g., "brand" for default, "product_attribute.rating_star" for custom)
180
180
  * @param content - Display content for the cell
181
181
  */
182
- [y]: (t, e) => `
182
+ [C]: (t, e) => `
183
183
  <tr>
184
184
  <td
185
185
  ${m}="${t}"