@useinsider/guido 3.9.0 → 3.9.1-beta.4718ccb

package/dist/extensions/Blocks/Items/utils/nodeConfigUtils.js

@@ -1,17 +1,24 @@
 import { ModificationDescription as b } from "../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { DefaultConfigValues as i, SETTINGS_ENUMS as n, ItemInCartOptions as g } from "../enums/settingsEnums.js";
+import { ItemInCartOptions as p, DefaultConfigValues as i, SETTINGS_ENUMS as c } from "../enums/settingsEnums.js";
 function _() {
   return String(Date.now() + Math.floor(Math.random() * 1e3));
 }
-const E = (r) => r.replace(/\$/g, "$$$$");
-function y() {
+const S = (r) => r.replace(/\$/g, "$$$$");
+function y(r, t) {
+  const e = p[t], n = e ? e.findIndex((u) => u.value === r) : -1;
+  if (n >= 0)
+    return String(n + 1);
+  const o = typeof r == "string" ? r.match(/\((\d+)\)/) : null;
+  return (o == null ? void 0 : o[1]) ?? "1";
+}
+function A() {
   return {
     initialized: !0,
     blockInstanceId: _(),
-    source: n.ITEMS_TYPE.CART_ITEMS,
-    type: n.ITEMS_TYPE.CART_ITEMS,
+    source: c.ITEMS_TYPE.CART_ITEMS,
+    type: c.ITEMS_TYPE.CART_ITEMS,
     itemsSelectValue: i.cartItemsSelectControlValue,
-    orientation: n.ORIENTATION.VERTICAL,
+    orientation: c.ORIENTATION.VERTICAL,
     nameTrimming: i.productNameTrimmingControlValue === "1",
     priceHideDiscount: i.productPriceHideDiscountControlValue === "1",
     priceFormatted: i.productPriceFormattedControlValue === "1",
@@ -33,7 +40,7 @@ function y() {
     buttonVisible: i.productButtonVisible === "1"
   };
 }
-function p(r) {
+function g(r) {
   if (!r)
     return null;
   const t = r.closest(".items-block-v2");
@@ -41,14 +48,14 @@ function p(r) {
 }
 function m(r) {
   return r ? {
-    CartItems: n.ITEMS_TYPE.CART_ITEMS,
-    BrowsedItems: n.ITEMS_TYPE.BROWSED_ITEMS,
-    PurchasedItems: n.ITEMS_TYPE.PURCHASED_ITEMS,
+    CartItems: c.ITEMS_TYPE.CART_ITEMS,
+    BrowsedItems: c.ITEMS_TYPE.BROWSED_ITEMS,
+    PurchasedItems: c.ITEMS_TYPE.PURCHASED_ITEMS,
     // Also handle already correct formats
-    CART_ITEMS: n.ITEMS_TYPE.CART_ITEMS,
-    BROWSED_ITEMS: n.ITEMS_TYPE.BROWSED_ITEMS,
-    PURCHASED_ITEMS: n.ITEMS_TYPE.PURCHASED_ITEMS
-  }[r] || n.ITEMS_TYPE.CART_ITEMS : n.ITEMS_TYPE.CART_ITEMS;
+    CART_ITEMS: c.ITEMS_TYPE.CART_ITEMS,
+    BROWSED_ITEMS: c.ITEMS_TYPE.BROWSED_ITEMS,
+    PURCHASED_ITEMS: c.ITEMS_TYPE.PURCHASED_ITEMS
+  }[r] || c.ITEMS_TYPE.CART_ITEMS : c.ITEMS_TYPE.CART_ITEMS;
 }
 function f(r, t) {
   if (!r)
@@ -56,27 +63,27 @@ function f(r, t) {
   if (r.includes("{{"))
     return r;
   if (/^\d+$/.test(r)) {
-    const e = parseInt(r) - 1, o = g[t];
-    if (o && o[e])
-      return o[e].value;
+    const e = parseInt(r) - 1, n = p[t];
+    if (n && n[e])
+      return n[e].value;
   }
   return i.cartItemsSelectControlValue;
 }
-function C(r) {
+function I(r) {
   const t = r.querySelector("esd-config-block");
   if (!t)
     return null;
-  const e = (u, s) => u == null ? s : u === "1" || u === "true", o = (u, s) => u || s, c = t.getAttribute("data-type"), a = m(c), d = t.getAttribute("data-cart_items_select_control_value"), l = f(d, a);
+  const e = (a, s) => a == null ? s : a === "1" || a === "true", n = (a, s) => a || s, o = t.getAttribute("data-type"), u = m(o), d = t.getAttribute("data-cart_items_select_control_value"), l = f(d, u);
   return {
     initialized: e(t.getAttribute("data-initialized"), !1),
-    blockInstanceId: o(
+    blockInstanceId: n(
       t.getAttribute("data-block-instance-id"),
       _()
     ),
-    source: a,
-    type: a,
+    source: u,
+    type: u,
     itemsSelectValue: l,
-    orientation: t.getAttribute("data-card_orientation_control_value") || n.ORIENTATION.VERTICAL,
+    orientation: t.getAttribute("data-card_orientation_control_value") || c.ORIENTATION.VERTICAL,
     nameTrimming: e(
       t.getAttribute("data-product_name_control_trim"),
       !0
@@ -93,11 +100,11 @@ function C(r) {
       t.getAttribute("data-product_price_control_single_price"),
       !1
     ),
-    priceCurrencySymbol: o(
+    priceCurrencySymbol: n(
       t.getAttribute("data-product_price_control_currency_symbol"),
       i.productPriceCurrencySymbolControlValue
     ),
-    priceCurrencyLocation: o(
+    priceCurrencyLocation: n(
       t.getAttribute("data-product_price_currency_location"),
       i.productPriceCurrencyLocationControlValue
     ),
@@ -106,15 +113,15 @@ function C(r) {
       t.getAttribute("data-product_quantity_control_enabled"),
       !0
     ),
-    buttonLink: o(
+    buttonLink: n(
       t.getAttribute("data-product_button_link"),
       i.productButtonLinkControlValue
     ),
-    imageLink: o(
+    imageLink: n(
       t.getAttribute("data-product_image_link"),
       i.productImageLinkControlValue
     ),
-    buttonLabel: o(
+    buttonLabel: n(
       t.getAttribute("data-product_button_control_label"),
       "Buy"
     ),
@@ -149,7 +156,7 @@ function C(r) {
     )
   };
 }
-function I(r) {
+function C(r) {
   if (typeof r.getAttribute != "function")
     return null;
   const t = r.getAttribute("esd-ext-config");
@@ -163,31 +170,32 @@ function I(r) {
   }
   return null;
 }
-function A(r) {
-  const t = p(r);
+function V(r) {
+  const t = g(r);
   if (!t)
     return null;
   const e = t.getNodeConfig();
   if (e && e.initialized)
     return e;
+  const n = C(t);
+  if (n)
+    return n;
   const o = I(t);
-  if (o)
-    return o;
-  const c = C(t);
-  return c || null;
+  return o || null;
 }
-function V(r, t, e, o) {
-  const c = p(r);
-  if (!c)
+function M(r, t, e, n) {
+  const o = g(r);
+  if (!o)
     return;
-  const d = { ...c.getNodeConfig() || {}, ...e }, l = o ?? t.getDocumentModifier();
-  l.modifyHtml(c).setNodeConfig(d), o || l.apply(new b("Update Items block configuration"));
+  const d = { ...o.getNodeConfig() || {}, ...e }, l = n ?? t.getDocumentModifier();
+  l.modifyHtml(o).setNodeConfig(d), n || l.apply(new b("Update Items block configuration"));
 }
 export {
-  E as escapeReplacement,
+  y as deriveItemNumber,
+  S as escapeReplacement,
   _ as generateBlockInstanceId,
-  y as getDefaultItemsBlockConfig,
-  A as getItemsBlockConfig,
-  p as getItemsBlockContainer,
-  V as setItemsBlockConfig
+  A as getDefaultItemsBlockConfig,
+  V as getItemsBlockConfig,
+  g as getItemsBlockContainer,
+  M as setItemsBlockConfig
 };

package/dist/extensions/Blocks/Recommendation/templates/list/template.js

@@ -1,5 +1,5 @@
-import { ATTR_PRODUCT_IMAGE as p, ATTR_PRODUCT_BUTTON as C, ATTR_PRODUCT_OLD_PRICE as f, ATTR_PRODUCT_PRICE as m } from "../../constants/selectors.js";
-import { buildSpacer as I, DEFAULT_CARD_COMPOSITION as g, buildElementRenderer as E, buildCellOptions as a, resolveInlinePriceOrder as w, DEFAULT_CARD_VISIBILITY as y } from "../utils.js";
+import { ATTR_PRODUCT_IMAGE as p, ATTR_PRODUCT_BUTTON as C, ATTR_PRODUCT_OLD_PRICE as A, ATTR_PRODUCT_PRICE as m } from "../../constants/selectors.js";
+import { buildSpacer as I, DEFAULT_CARD_COMPOSITION as g, buildElementRenderer as E, buildCellOptions as i, resolveInlinePriceOrder as w, DEFAULT_CARD_VISIBILITY as y } from "../utils.js";
 import { listElementRenderer as L, renderInlineListPriceRow as O } from "./elementRenderer.js";
 const S = "0 5px";
 function U(l, r, n) {
@@ -27,40 +27,40 @@ const N = `
         </td>
     </tr>
 `;
-function $(l, r = g, n = {}, e = {}) {
+function x(l, r = g, n = {}, e = {}) {
   const {
     cellPadding: o = S,
     cardBackgroundColor: d,
     visibility: c,
-    priceInline: i = !1
-  } = e, u = d ? ` style="background-color: ${d};"` : "", s = E(L, r, n), P = s[p](l, a(p, e)), R = w(r), T = `
+    priceInline: a = !1
+  } = e, u = d ? ` style="table-layout: fixed; background-color: ${d};"` : ' style="table-layout: fixed;"', s = E(L, r, n), P = s[p](l, i(p, e)), R = w(r), T = `
         <td class="product-info-cell" valign="middle" style="padding: 15px;">
             <table cellpadding="0" cellspacing="0" role="presentation" width="100%" style="table-layout: fixed;">
                 <tbody>
-                    ${r.filter((t) => t !== p && t !== C).filter((t) => !(i && t === R.skip)).filter((t) => s[t]).map((t) => {
-    const b = (c == null ? void 0 : c[t]) ?? y[t] ?? !0, A = i && t === R.anchor ? O(
+                    ${r.filter((t) => t !== p && t !== C).filter((t) => !(a && t === R.skip)).filter((t) => s[t]).map((t) => {
+    const b = (c == null ? void 0 : c[t]) ?? y[t] ?? !0, f = a && t === R.anchor ? O(
       l,
       R.originalFirst,
-      a(m, e),
-      a(f, e)
-    ) : s[t](l, a(t, e));
-    return U(A, t, b);
+      i(m, e),
+      i(A, e)
+    ) : s[t](l, i(t, e));
+    return U(f, t, b);
   }).join(`
                     `)}
                 </tbody>
             </table>
         </td>
-    `, _ = s[C](l, a(C, e)), D = P + T + _;
+    `, _ = s[C](l, i(C, e)), D = P + T + _;
   return N.replace("{-{-CARD_PADDING-}-}", o).replace("{-{-WRAPPER_STYLE-}-}", u).replace("{-{-PRODUCT_CONTENT-}-}", D);
 }
 function W(l, r, n = {}, e = {}) {
   const o = I(e.rowSpacingPx);
   return l.map((d, c) => {
-    const i = $(d, r, n, e);
-    return c > 0 ? o + i : i;
+    const a = x(d, r, n, e);
+    return c > 0 ? o + a : a;
   }).join("");
 }
 export {
-  $ as getListProductCard,
+  x as getListProductCard,
   W as prepareProductRows
 };

package/dist/extensions/Blocks/Recommendation/utils/captureStyleTemplates.js

@@ -1,9 +1,9 @@
 import { RecommendationBlockId as c } from "../constants/blockIds.js";
-import { DESKTOP_CONTAINER_SELECTOR as S, ATTR_PRODUCT_NAME as k, ATTR_PRODUCT_PRICE as E, ATTR_PRODUCT_OLD_PRICE as h, ATTR_PRODUCT_OMNIBUS_PRICE as y, ATTR_PRODUCT_OMNIBUS_DISCOUNT as m, ATTR_PRODUCT_BUTTON as P, ATTR_PRODUCT_IMAGE as x, ATTR_PRODUCT_ATTR as v } from "../constants/selectors.js";
+import { DESKTOP_CONTAINER_SELECTOR as S, ATTR_PRODUCT_NAME as E, ATTR_PRODUCT_PRICE as p, ATTR_PRODUCT_OLD_PRICE as y, ATTR_PRODUCT_OMNIBUS_PRICE as C, ATTR_PRODUCT_OMNIBUS_DISCOUNT as A, ATTR_PRODUCT_BUTTON as P, ATTR_PRODUCT_IMAGE as q, ATTR_PRODUCT_ATTR as x } from "../constants/selectors.js";
 import { CSS_CLASS_TEXT_TRIM as B } from "../controls/shared/textTrimCssRules.js";
-import { toCustomCompositionKey as U } from "../templates/utils.js";
-import { extractWrapperTags as C } from "./preserveTextStyles.js";
-import { hasQuerySelectorAll as A, hasGetAttribute as l, hasGetStyle as R, hasGetComputedStyle as q } from "./tagName.js";
+import { toCustomCompositionKey as v } from "../templates/utils.js";
+import { extractWrapperTags as R } from "./preserveTextStyles.js";
+import { hasQuerySelectorAll as _, hasGetAttribute as l, hasGetStyle as I, hasGetComputedStyle as U } from "./tagName.js";
 const s = [
   "font-size",
   "font-family",
@@ -39,94 +39,94 @@ const s = [
   "border-radius",
   "margin"
 ], b = /* @__PURE__ */ new Set(["transparent", "rgba(0, 0, 0, 0)"]), G = [
-  { attrKey: k, blockId: c.NAME, kind: "text" },
-  { attrKey: E, blockId: c.PRICE, kind: "text" },
-  { attrKey: h, blockId: c.OLD_PRICE, kind: "text" },
-  { attrKey: y, blockId: c.OMNIBUS_PRICE, kind: "text" },
-  { attrKey: m, blockId: c.OMNIBUS_DISCOUNT, kind: "text" },
+  { attrKey: E, blockId: c.NAME, kind: "text" },
+  { attrKey: p, blockId: c.PRICE, kind: "text" },
+  { attrKey: y, blockId: c.OLD_PRICE, kind: "text" },
+  { attrKey: C, blockId: c.OMNIBUS_PRICE, kind: "text" },
+  { attrKey: A, blockId: c.OMNIBUS_DISCOUNT, kind: "text" },
   { attrKey: P, blockId: c.BUTTON, kind: "button" },
-  { attrKey: x, blockId: c.IMAGE, kind: "image" }
+  { attrKey: q, blockId: c.IMAGE, kind: "image" }
 ];
-function _(t) {
+function O(t) {
   return t && "getInnerHTML" in t && typeof t.getInnerHTML == "function" ? t.getInnerHTML().trim() : "";
 }
 function L(t) {
   return t && "getInnerText" in t && typeof t.getInnerText == "function" ? t.getInnerText().trim() : "";
 }
 function a(t, e, r) {
-  !e || !R(e) || r.forEach((n) => {
-    const i = e.getStyle(n);
-    i && i !== "inherit" && i !== "initial" && (t[n] = i);
+  !e || !I(e) || r.forEach((n) => {
+    const o = e.getStyle(n);
+    o && o !== "inherit" && o !== "initial" && (t[n] = o);
   });
 }
-function I(t) {
+function h(t) {
   return Object.entries(t).map(([e, r]) => `${e}: ${r};`).join(" ");
 }
-function O(t) {
-  if (!t || !R(t))
+function k(t) {
+  if (!t || !I(t))
     return;
   const e = t.getStyle("background-color") || t.getStyle("background");
   return e && !b.has(e) ? e : void 0;
 }
 function g(t, e) {
   const r = {};
-  return a(r, t, e), I(r);
+  return a(r, t, e), h(r);
 }
 function w(t) {
   const e = t.querySelector("p"), r = {};
   a(r, t, s), a(r, e, s), a(r, t.querySelector("strong"), s), a(r, t.querySelector("em"), s), a(r, t.querySelector("s"), s);
-  const n = I(r), { openTags: i, closeTags: o } = C(_(e));
-  return !n && !i ? null : { pStyle: n || void 0, openTags: i, closeTags: o };
+  const n = h(r), { openTags: o, closeTags: i } = R(O(e));
+  return !n && !o ? null : { pStyle: n || void 0, openTags: o, closeTags: i };
 }
-function K(t) {
-  const e = t.querySelector(".es-button-border"), r = t.querySelector("a.es-button") ?? t.querySelector("a"), n = g(e, N), i = g(r, M), o = e && "getAttribute" in e ? e.getAttribute("class") ?? "" : "", u = /\bes-fw\b/.test(o), { openTags: T, closeTags: d } = C(_(r)), p = L(r);
-  return !n && !i && !u && !T && !p ? null : {
+function $(t) {
+  const e = t.querySelector(".es-button-border"), r = t.querySelector("a.es-button") ?? t.querySelector("a"), n = g(e, N), o = g(r, M), i = e && "getAttribute" in e ? e.getAttribute("class") ?? "" : "", u = /\bes-fw\b/.test(i), { openTags: T, closeTags: d } = R(O(r)), m = L(r);
+  return !n && !o && !u && !T && !m ? null : {
     buttonBorderStyle: n || void 0,
-    buttonAnchorStyle: i || void 0,
+    buttonAnchorStyle: o || void 0,
     buttonFitToContainer: u || void 0,
-    buttonText: p || void 0,
+    buttonText: m || void 0,
     openTags: T,
     closeTags: d
   };
 }
-function H(t) {
+function K(t) {
   const e = g(t.querySelector("img"), D);
   return e ? { imgStyle: e } : null;
 }
-function $(t, e) {
-  return e === "button" ? K(t) : e === "image" ? H(t) : w(t);
+function H(t, e) {
+  return e === "button" ? $(t) : e === "image" ? K(t) : w(t);
 }
 function f(t, e) {
   if (!t || !("querySelector" in t))
     return;
   const r = t.querySelector(S) ?? t;
-  if (G.forEach(({ attrKey: o, blockId: u, kind: T }) => {
+  if (G.forEach(({ attrKey: i, blockId: u, kind: T }) => {
     const d = r.querySelector(`[esd-extension-block-id="${u}"]`);
-    d && e(d, o, T);
-  }), !A(r))
+    d && e(d, i, T);
+  }), !_(r))
     return;
   const n = /* @__PURE__ */ new Set();
   r.querySelectorAll(
     `[esd-extension-block-id="${c.CUSTOM_ATTRIBUTE}"]`
-  ).forEach((o) => {
-    const u = l(o) ? o.getAttribute(v) : null;
-    !u || n.has(u) || (n.add(u), e(o, U(u), "text"));
+  ).forEach((i) => {
+    const u = l(i) ? i.getAttribute(x) : null;
+    !u || n.has(u) || (n.add(u), e(i, v(u), "text"));
   });
 }
 function F(t) {
   const e = {};
-  return f(t, (r, n, i) => {
+  return f(t, (r, n, o) => {
     if (!("querySelector" in r))
       return;
-    const o = $(r, i);
-    o && (e[n] = o);
+    const i = H(r, o);
+    i && (e[n] = i);
   }), e;
 }
 function j(t) {
   if (!t || !("querySelector" in t))
     return;
   const e = t.querySelector(S) ?? t, r = e.querySelector(".product-card-segment") ?? e.querySelector(".product-card-wrapper");
-  return O(r);
+  return k(r);
 }
 function X(t) {
   if (!t)
@@ -134,28 +134,28 @@ function X(t) {
   const e = l(t) ? t.getAttribute("bgcolor") : null;
   if (e && !b.has(e))
     return e;
-  const r = O(t);
+  const r = k(t);
   if (r)
     return r;
-  const n = q(t) ? t.getComputedStyle("background-color") : void 0;
+  const n = U(t) ? t.getComputedStyle("background-color") : void 0;
   return n && !b.has(n) ? n : void 0;
 }
 function z(t) {
   const e = {};
-  return f(t, (r, n, i) => {
-    if (i !== "text")
+  return f(t, (r, n, o) => {
+    if (o !== "text")
       return;
-    const o = X(r);
-    o && (e[n] = o);
+    const i = X(r);
+    i && (e[n] = i);
   }), e;
 }
 function Q(t) {
   const e = {};
-  return f(t, (r, n, i) => {
-    if (i === "image")
+  return f(t, (r, n, o) => {
+    if (o === "image")
       return;
-    const o = l(r) ? r.getAttribute("align") : null;
-    o && (e[n] = o);
+    const i = l(r) ? r.getAttribute("align") : null;
+    i && (e[n] = i);
   }), e;
 }
 const V = /^es-[pm]\d+[trbl]?$/;
@@ -167,44 +167,50 @@ function W(t) {
   return r.length ? r.join(" ") : void 0;
 }
 function Y(t) {
-  const e = {};
-  return f(t, (r, n, i) => {
-    if (i === "image")
+  if (!t || !("querySelector" in t))
+    return !1;
+  const e = t.querySelector(S) ?? t, r = (n) => !!(n && "querySelector" in n && n.querySelector(".product-price") && n.querySelector(".product-old-price"));
+  return r(e.querySelector(`[data-attribute-type="${p}"]`)) || r(e.querySelector(`[data-attribute-type="${y}"]`));
+}
+function J(t) {
+  const e = {}, r = Y(t);
+  return f(t, (n, o, i) => {
+    if (i === "image" || r && (o === p || o === y))
       return;
-    const o = W(r);
-    o && (e[n] = o);
+    const u = W(n);
+    u && (e[o] = u);
   }), e;
 }
-function J(t) {
+function Z(t) {
   const e = {};
   return f(t, (r, n) => {
-    if (n !== y && n !== m || !l(r))
+    if (n !== C && n !== A || !l(r))
       return;
-    const i = r.getAttribute("data-text-before"), o = r.getAttribute("data-text-after");
-    (i != null || o != null) && (e[n] = { before: i ?? void 0, after: o ?? void 0 });
+    const o = r.getAttribute("data-text-before"), i = r.getAttribute("data-text-after");
+    (o != null || i != null) && (e[n] = { before: o ?? void 0, after: i ?? void 0 });
   }), e;
 }
-function Z(t) {
+function tt(t) {
   const e = {};
   if (!t || !("querySelector" in t))
     return e;
   const r = t.querySelector(S) ?? t;
-  return A(r) && r.querySelectorAll(".recommendation-attribute-row").forEach((n) => {
+  return _(r) && r.querySelectorAll(".recommendation-attribute-row").forEach((n) => {
     if (!l(n))
       return;
-    const i = n.getAttribute("data-attribute-type"), o = n.getAttribute("data-visibility");
-    i && o != null && (e[i] = o !== "0");
+    const o = n.getAttribute("data-attribute-type"), i = n.getAttribute("data-visibility");
+    o && i != null && (e[o] = i !== "0");
   }), e;
 }
-function ut(t) {
+function ct(t) {
   return {
     styleTemplates: F(t),
     cardBackgroundColor: j(t),
     cellBackgroundColors: z(t),
     cellAlignments: Q(t),
-    cellClasses: Y(t),
-    omnibusTexts: J(t),
-    visibility: Z(t)
+    cellClasses: J(t),
+    omnibusTexts: Z(t),
+    visibility: tt(t)
   };
 }
 export {
@@ -212,8 +218,8 @@ export {
   j as captureCardBackgroundColor,
   Q as captureCellAlignments,
   z as captureCellBackgroundColors,
-  Y as captureCellClasses,
-  J as captureOmnibusTexts,
-  ut as captureStyles,
-  Z as captureVisibility
+  J as captureCellClasses,
+  Z as captureOmnibusTexts,
+  ct as captureStyles,
+  tt as captureVisibility
 };

package/dist/package.json.js

@@ -1,4 +1,4 @@
-const o = { stripo: { version: "2.66.0" } }, s = {
+const o = { stripo: { version: "2.68.0" } }, s = {
   guido: o
 };
 export {

package/dist/src/composables/useCortexBlueprintBridge.d.ts

@@ -9,8 +9,11 @@
  * The bridge handles two segment shapes:
  *
  *   - `blueprint` segments with `blueprintType === 'email_template'` are
- *     applied to the Stripo editor (immediate on first sighting, debounced on
- *     update, identical-html no-ops).
+ *     applied to the Stripo editor, but ONLY after the user clicks
+ *     "Apply to editor" in cortex-fe (which sets `applyRequested` on the
+ *     segment). Before that the template is marked `pending` and nothing is
+ *     written to Stripo. Once applied, refines flow through debounced;
+ *     identical-html no-ops.
  *   - `error` segments (and message-level `isError` / `isCancelled`) trigger
  *     a localized toaster.
  *

package/dist/src/composables/useEmailTemplateApplier.d.ts

@@ -2,12 +2,17 @@ type ApplyStatus = 'pending' | 'applying' | 'applied' | 'failed';
 /**
  * Applies email_template blueprints from the chat agent to the Stripo editor.
  *
- * - blueprint_create + manual Apply click: immediate.
- * - blueprint_update: debounced 250 ms trailing so rapid mid-stream updates
- *   don't thrash updateHtmlAndCss.
+ * The first apply is gated behind the user's "Apply to editor" click — until
+ * then a blueprint is only marked `pending` (see `markPending`) and nothing is
+ * written to the editor.
+ *
+ * - manual Apply click (first apply): immediate.
+ * - blueprint_update after the user has applied once: debounced 250 ms trailing
+ *   so rapid mid-stream updates don't thrash updateHtmlAndCss.
  */
 export declare const useEmailTemplateApplier: () => {
     applyStatus: import("vue").Ref<Record<string, ApplyStatus>>;
+    markPending: (blueprintId: string) => void;
     applyTemplate: (blueprintId: string, data: {
         html?: string;
         css?: string;

package/dist/src/extensions/Blocks/Items/block.d.ts

@@ -33,4 +33,13 @@ export declare class ItemsBlock extends Block {
      * Guarded to the nodeConfig-empty case so it runs once and never loops.
      */
     onDocumentChanged(node: ImmutableHtmlNode): void;
+    /**
+     * Bakes the compiler-read DOM attributes (`data-type`, `data-number`) onto the
+     * `.ins-product-td` container from the recovered config. Required for saved modules:
+     * `migrate()` (which backfills these) only runs at template load — never when a module
+     * is dropped into a live editor — so this is the one place the namespace + index get
+     * restored before export. The name `<a>` carries no data-type/data-number of its own and
+     * relies on this td-level fallback in pairProductVariables.
+     */
+    private _stampProductTdDomAttributes;
 }

package/dist/src/extensions/Blocks/Items/template.d.ts

@@ -3,6 +3,13 @@ declare const migrationTemplate = "ADD YOUR MIGRATION HERE";
 type ProductType = 'CART_ITEMS' | 'BROWSED_ITEMS' | 'PURCHASED_ITEMS';
 type OrientationType = 'vertical' | 'horizontal';
 type PriceOrientationType = 'vertical' | 'horizontal';
+/**
+ * Wraps a bare migrate-block `<td>` in a `<tr>` so it forms a valid table row.
+ * Stripo renders its `BlockType.*` tags as full rows, so both the migrate template
+ * (here) and the orientation-change rebuild (settingsControl._reOrderTemplate) must
+ * emit `<tr><td>` — otherwise the code editor flags the bare cell as invalid.
+ */
+export declare const wrapInTableRow: (html: string) => string;
 type TemplateParameters = {
     orientation: OrientationType;
     itemsType: ProductType;

package/dist/src/extensions/Blocks/Items/utils/nodeConfigUtils.d.ts

@@ -40,6 +40,18 @@ export declare function generateBlockInstanceId(): string;
  * Prevents currency symbols like "$", "R$", "HK$" from being interpreted as special replacement patterns.
  */
 export declare const escapeReplacement: (str: string) => string;
+/**
+ * Derives a card's 1-based product index from its `itemsSelectValue`.
+ * Prefers the position within ItemInCartOptions for the type; falls back to the
+ * `(N)` token in the value (e.g. "{{Browsed Item (3) Url}}" -> "3"); defaults to "1".
+ *
+ * Single source of truth so block.ts, settingsControl and template.ts stay in sync —
+ * the number feeds `data-number`, which pairProductVariables reads to index merge tags.
+ *
+ * `itemsSelectValue` is typed loosely because callers pass it straight from parsed
+ * configs where the field can be absent — the runtime guard below is load-bearing.
+ */
+export declare function deriveItemNumber(itemsSelectValue: string | undefined, itemsType: ProductType): string;
 /**
  * Returns default ItemsBlockConfig values.
  * These are used when initializing a new block or when migrating from legacy format.

package/dist/src/extensions/Blocks/Recommendation/utils/captureStyleTemplates.d.ts

@@ -51,6 +51,12 @@ export declare function captureCellAlignments(node: ImmutableHtmlNode | null | u
  * text-trim) keyed by composition key, so a regeneration can re-bake them
  * instead of resetting to the renderer's hardcoded spacing classes. Stripo stores padding
  * and margin as these classes (NOT inline style), so an inline-style capture misses them.
+ *
+ * Inline price mode: the merged columns carry POSITIONAL spacing classes
+ * (`es-p15l es-p5r` / `es-p5l es-p15r`) that build the side-by-side gap — layout
+ * mechanics, not user padding. Skip the price cells then, so toggling back to
+ * stacked resets them to the renderer defaults instead of baking the lopsided
+ * inline paddings (SD-145161).
  */
 export declare function captureCellClasses(node: ImmutableHtmlNode | null | undefined): Record<string, string>;
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.9.0",
+  "version": "3.9.1-beta.4718ccb",
   "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
   "main": "./dist/guido.umd.cjs",
   "module": "./dist/library.js",
@@ -104,7 +104,7 @@
   },
   "guido": {
     "stripo": {
-      "version": "2.66.0"
+      "version": "2.68.0"
     }
   }
 }