@useinsider/guido 3.2.0-beta.22a0c4c → 3.2.0-beta.250b0a1

package/dist/config/compiler/utils/recommendationCompilerUtils.js

@@ -1,11 +1,10 @@
 import { useConfig as S } from "../../../composables/useConfig.js";
 import { useRecommendation as _ } from "../../../composables/useRecommendation.js";
-import { useRecommendationExtensionStore as d } from "../../../extensions/Blocks/Recommendation/store/recommendation.js";
 function y(e, u, r, o, s = "") {
   const n = `{{${s}${e}_${u}_${r}}}`, t = `{{${s}${e}_${u}_currency}}`;
   return o === "before" ? `${t} ${n}` : `${n} ${t}`;
 }
-function m(e, u, r, o, s, n) {
+function p(e, u, r, o, s, n) {
   switch (u) {
     case "productImage": {
       const t = e.querySelector("img");
@@ -70,69 +69,67 @@ function m(e, u, r, o, s, n) {
     default: {
       const t = e.getAttribute("product-attr") ? e : e.querySelector("[product-attr]");
       if (t) {
-        const c = t.getAttribute("product-attr"), a = t.querySelector("p");
-        if (a) {
-          const i = a.querySelector("strong") || a;
-          i.textContent = `{{${n}${r}_${o}_${c}}}`;
+        const c = t.getAttribute("product-attr"), i = t.querySelector("p");
+        if (i) {
+          const a = i.querySelector("strong") || i;
+          a.textContent = `{{${n}${r}_${o}_${c}}}`;
         }
       }
       break;
     }
   }
 }
-function q(e, u, r, o) {
+function d(e, u, r, o) {
   e.querySelectorAll(".recommendation-product-row").forEach((n, t) => {
-    n.querySelectorAll("[data-attribute-type]").forEach((a) => {
-      const i = a.getAttribute("data-attribute-type") || "", l = a.querySelectorAll(".attribute-cell");
-      l.length > 0 ? l.forEach((p) => {
-        m(p, i, u, t, r, o);
-      }) : m(a, i, u, t, r, o);
+    n.querySelectorAll("[data-attribute-type]").forEach((i) => {
+      const a = i.getAttribute("data-attribute-type") || "", b = i.querySelectorAll(".attribute-cell");
+      b.length > 0 ? b.forEach((l) => {
+        p(l, a, u, t, r, o);
+      }) : p(i, a, u, t, r, o);
     });
   });
 }
-function g(e, u, r, o) {
+function q(e, u, r, o) {
   const s = e.querySelectorAll(".recommendation-product-row");
   if (!s.length)
     return;
   const [n] = s, t = n.querySelector("[data-attribute-type]"), c = t ? t.querySelectorAll(".attribute-cell").length : 1;
-  s.forEach((a, i) => {
-    a.querySelectorAll("[data-attribute-type]").forEach((p) => {
-      const b = p.getAttribute("data-attribute-type") || "";
-      p.querySelectorAll(".attribute-cell").forEach((f, $) => {
-        const A = i * c + $;
-        m(f, b, u, A, r, o);
+  s.forEach((i, a) => {
+    i.querySelectorAll("[data-attribute-type]").forEach((l) => {
+      const m = l.getAttribute("data-attribute-type") || "";
+      l.querySelectorAll(".attribute-cell").forEach(($, f) => {
+        const A = a * c + f;
+        p($, m, u, A, r, o);
       });
     });
   });
 }
-function h(e, u, r, o) {
+function g(e, u, r, o) {
   e.querySelectorAll(".ins-recommendation-product-container").forEach((n) => {
-    g(n, u, r, o);
+    q(n, u, r, o);
   });
 }
-function C(e, u, r) {
+function h(e, u, r) {
   const o = e.getAttribute("data-layout") || "grid", s = e.getAttribute("currency-alignment") || "after";
-  o === "list" ? q(e, u, s, r) : h(e, u, s, r);
+  o === "list" ? d(e, u, s, r) : g(e, u, s, r);
 }
-function E(e, u) {
+function C(e, u) {
   const r = e.match(/<!DOCTYPE[^>]*>/i);
   return (r ? `${r[0]}
 ` : "") + u.documentElement.outerHTML;
 }
-function T(e) {
+function P(e) {
   const u = e.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), r = new DOMParser().parseFromString(u, "text/html"), o = r.querySelectorAll(".recommendation-block-v2");
   if (!o.length)
     return e;
-  const { buildCampaignUrl: s } = _(), n = d();
-  n.recommendationCampaignUrls = {};
-  const { isFeatureEnabled: t } = S(), c = t("liquidSyntax") ? "reco_" : "";
+  const { buildCampaignUrl: s } = _(), { isFeatureEnabled: n } = S(), t = n("liquidSyntax") ? "reco_" : "";
   return o.forEach((i) => {
-    var p, b;
-    const l = i.getAttribute("recommendation-id");
-    l && ((p = i.parentNode) == null || p.insertBefore(r.createComment("REC_START"), i), (b = i.parentNode) == null || b.insertBefore(r.createComment("REC_END"), i.nextSibling), s(l), C(i, l, c));
-  }), E(u, r).replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("&lt;!--{%", "{%").replaceAll("%}--&gt;", "%}");
+    var b, l;
+    const a = i.getAttribute("recommendation-id");
+    a && ((b = i.parentNode) == null || b.insertBefore(r.createComment("REC_START"), i), (l = i.parentNode) == null || l.insertBefore(r.createComment("REC_END"), i.nextSibling), s(a), h(i, a, t));
+  }), C(u, r).replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("&lt;!--{%", "{%").replaceAll("%}--&gt;", "%}");
 }
 export {
   y as formatPriceVariable,
-  T as prepareRecommendationBlocks
+  P as prepareRecommendationBlocks
 };

package/dist/config/migrator/radioButtonMigrator.js

@@ -1,87 +1,95 @@
-var x = Object.defineProperty;
-var f = (r, t, e) => t in r ? x(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
-var b = (r, t, e) => f(r, typeof t != "symbol" ? t + "" : t, e);
-import h from "../../extensions/Blocks/RadioButton/template.js";
-class T {
+var f = Object.defineProperty;
+var h = (o, e, t) => e in o ? f(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
+var y = (o, e, t) => h(o, typeof e != "symbol" ? e + "" : e, t);
+import T from "../../extensions/Blocks/RadioButton/template.js";
+class S {
   constructor() {
-    b(this, "parser");
+    y(this, "parser");
     this.parser = new DOMParser();
   }
-  migrate(t) {
+  migrate(e) {
     try {
-      const e = this.parser.parseFromString(t, "text/html"), i = e.querySelectorAll("td.radio-button-block");
-      return i.length === 0 ? t : (i.forEach((s) => {
-        if (s.classList.contains("radio-button-v2"))
+      const t = this.parser.parseFromString(e, "text/html"), s = t.querySelectorAll("td.radio-button-block"), i = t.querySelectorAll("td.radio-button-v2");
+      return s.length === 0 && i.length === 0 ? e : (s.forEach((r) => {
+        if (r.classList.contains("radio-button-v2"))
           return;
-        const n = s.getAttribute("id"), l = this.extractTextFromElement(s, "ins-title"), a = this.extractTextFromElement(s, "ins-description"), p = this.extractTextFromElement(s, "ins-subscribe"), u = this.extractTextFromElement(s, "ins-unsubscribe"), d = this.buildTextBlock(l), g = this.buildTextBlock(a), m = this.buildTextBlock({ ...p, classList: "" }), o = this.buildTextBlock({ ...u, classList: "" }), c = h.replace("{-{-TITLE-}-}", d).replace("{-{-DESCRIPTION-}-}", g).replace("{-{-YES-}-}", m).replace("{-{-NO-}-}", o), y = this.parser.parseFromString(
-          `<table id="tempDoc"><tbody><tr>${c}</tr></tbody></table>`,
+        const l = r.getAttribute("id"), n = this.extractTextFromElement(r, "ins-title"), c = this.extractTextFromElement(r, "ins-description"), a = this.extractTextFromElement(r, "ins-subscribe"), p = this.extractTextFromElement(r, "ins-unsubscribe"), g = this.buildTextBlock(n), m = this.buildTextBlock(c), d = this.buildTextBlock({ ...a, classList: "" }), u = this.buildTextBlock({ ...p, classList: "" }), x = T.replace("{-{-TITLE-}-}", g).replace("{-{-DESCRIPTION-}-}", m).replace("{-{-YES-}-}", d).replace("{-{-NO-}-}", u), b = this.parser.parseFromString(
+          `<table id="tempDoc"><tbody><tr>${x}</tr></tbody></table>`,
           "text/html"
         ).querySelector(".radio-button-v2");
-        y && s.parentNode && (y.setAttribute("id", n || ""), s.parentNode.replaceChild(y, s));
-      }), e.documentElement.outerHTML);
-    } catch (e) {
-      return console.error("RadioButtonMigrator failed:", e), t;
+        b && r.parentNode && (b.setAttribute("id", l || ""), r.parentNode.replaceChild(b, r));
+      }), t.querySelectorAll("td.radio-button-v2 input#radioYes").forEach((r) => {
+        var a, p;
+        const l = (a = r.parentElement) == null ? void 0 : a.querySelector(":scope > p"), n = (p = r.parentElement) == null ? void 0 : p.parentElement;
+        if (!l || (n == null ? void 0 : n.tagName) !== "TR")
+          return;
+        r.removeAttribute("esd-block-text");
+        const c = t.createElement("td");
+        c.className = "esd-block-text", c.appendChild(l), n.appendChild(c);
+      }), t.documentElement.outerHTML);
+    } catch (t) {
+      return console.error("RadioButtonMigrator failed:", t), e;
     }
   }
-  extractTextFromElement(t, e) {
-    var o, c;
-    const i = t.querySelector(`.${e}`);
-    if (!i)
+  extractTextFromElement(e, t) {
+    var d, u;
+    const s = e.querySelector(`.${t}`);
+    if (!s)
       return {
-        text: e === "ins-title" ? "Title" : "Description",
+        text: t === "ins-title" ? "Title" : "Description",
         isBold: !1,
         isItalic: !1,
         align: "left",
         styles: "",
         classList: ""
       };
-    const s = i.querySelector("p");
-    if (!s)
+    const i = s.querySelector("p");
+    if (!i)
       return {
-        text: ((o = i.textContent) == null ? void 0 : o.trim()) || (e === "ins-title" ? "Title" : "Description"),
+        text: ((d = s.textContent) == null ? void 0 : d.trim()) || (t === "ins-title" ? "Title" : "Description"),
         isBold: !1,
         isItalic: !1,
-        align: i.getAttribute("align") || "left",
+        align: s.getAttribute("align") || "left",
         styles: "",
         classList: ""
       };
-    const n = ((c = s.textContent) == null ? void 0 : c.trim()) || (e === "ins-title" ? "Title" : "Description"), l = s.getAttribute("style") || "", a = i.getAttribute("align") || s.getAttribute("align") || "left", p = /font-weight\s*:\s*bold/i.test(l) || !!s.querySelector("b, strong"), u = /font-style\s*:\s*italic/i.test(l) || !!s.querySelector("i, em"), d = this.removeStyleProperties(l, ["font-weight", "font-style"]), g = this.convertInlineToBlock(d), m = i.getAttribute("class") || "";
+    const r = ((u = i.textContent) == null ? void 0 : u.trim()) || (t === "ins-title" ? "Title" : "Description"), l = i.getAttribute("style") || "", n = s.getAttribute("align") || i.getAttribute("align") || "left", c = /font-weight\s*:\s*bold/i.test(l) || !!i.querySelector("b, strong"), a = /font-style\s*:\s*italic/i.test(l) || !!i.querySelector("i, em"), p = this.removeStyleProperties(l, ["font-weight", "font-style"]), g = this.convertInlineToBlock(p), m = s.getAttribute("class") || "";
     return {
-      text: n,
-      isBold: p,
-      isItalic: u,
-      align: a,
+      text: r,
+      isBold: c,
+      isItalic: a,
+      align: n,
       styles: g,
       classList: m
     };
   }
-  buildTextBlock(t) {
-    let e = t.text;
-    t.isBold && t.isItalic ? e = `<strong path="1,0"><em path="1,0,0">${e}</em></strong>` : t.isBold ? e = `<strong path="1,0">${e}</strong>` : t.isItalic && (e = `<em path="1,0">${e}</em>`);
-    const i = t.align ? ` align="${t.align}"` : "", s = t.styles ? ` style="${t.styles.replaceAll('"', "'")}"` : "";
+  buildTextBlock(e) {
+    let t = e.text;
+    e.isBold && e.isItalic ? t = `<strong path="1,0"><em path="1,0,0">${t}</em></strong>` : e.isBold ? t = `<strong path="1,0">${t}</strong>` : e.isItalic && (t = `<em path="1,0">${t}</em>`);
+    const s = e.align ? ` align="${e.align}"` : "", i = e.styles ? ` style="${e.styles.replaceAll('"', "'")}"` : "";
     return `
-            <td class="esd-block-text ${t.classList}" ${i}>
-                <p path="1" ${s}>
-                    ${e}
+            <td class="esd-block-text ${e.classList}" ${s}>
+                <p path="1" ${i}>
+                    ${t}
                 </p>
             </td>
         `;
   }
-  removeStyleProperties(t, e) {
-    return t ? e.reduce((s, n) => {
-      const l = new RegExp(`${n}\\s*:\\s*[^;]*;?`, "gi");
-      return s.replace(l, "");
-    }, t).replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim() : "";
+  removeStyleProperties(e, t) {
+    return e ? t.reduce((i, r) => {
+      const l = new RegExp(`${r}\\s*:\\s*[^;]*;?`, "gi");
+      return i.replace(l, "");
+    }, e).replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim() : "";
   }
-  convertInlineToBlock(t) {
-    if (!t)
+  convertInlineToBlock(e) {
+    if (!e)
       return "";
-    let e = t.replace(/display\s*:\s*inline/gi, "display: block");
-    return /display\s*:/i.test(e) || (e = e ? `${e}; display: block` : "display: block"), e.replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim();
+    let t = e.replace(/display\s*:\s*inline/gi, "display: block");
+    return /display\s*:/i.test(t) || (t = t ? `${t}; display: block` : "display: block"), t.replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim();
   }
 }
-function A(r) {
-  return new T().migrate(r);
+function A(o) {
+  return new S().migrate(o);
 }
 export {
   A as migrateRadioButton

package/dist/config/migrator/recommendationMigrator.js

@@ -13,7 +13,7 @@ class B {
   migrate(e) {
     try {
       const t = this.parser.parseFromString(e, "text/html"), s = t.querySelectorAll(
-        'td.ins-recommendation-v3-block-1:not(.recommendation-block-v2), td.product-block[esd-handler-name*="EmailRecommendationV3"]:not(.recommendation-block-v2)'
+        'td.ins-recommendation-v3-block-1, td.product-block[esd-handler-name*="EmailRecommendationV3"]'
       );
       return w().$patch((i) => {
         i.migrations = { ...i.migrations, [S]: s.length };

package/dist/extensions/Blocks/Recommendation/constants/controlIds.js

@@ -1,4 +1,4 @@
-var o = /* @__PURE__ */ ((c) => (c.BUTTON_ALIGN = "recommendation-block-button-align-control", c.BUTTON_BORDER = "recommendation-block-button-border-control", c.BUTTON_BORDER_RADIUS = "recommendation-block-button-border-radius-control", c.BUTTON_COLOR = "recommendation-block-button-color-control", c.BUTTON_FIT_TO_CONTENT = "recommendation-block-button-fit-to-content-control", c.BUTTON_FONT_FAMILY = "recommendation-block-button-font-family-control", c.BUTTON_MARGINS = "recommendation-block-button-margins-control", c.BUTTON_PADDINGS = "recommendation-block-button-paddings-control", c.BUTTON_TEXT = "recommendation-block-button-text-control", c.BUTTON_TEXT_SIZE = "recommendation-block-button-text-size-control", c.BUTTON_TEXT_STYLE_AND_FONT_COLOR = "recommendation-block-button-text-style-and-font-color-control", c.NAME_ALIGN = "recommendation-block-name-align-control", c.NAME_BACKGROUND = "recommendation-block-name-background-control", c.NAME_COLOR = "recommendation-block-name-color-control", c.NAME_FONT_FAMILY = "recommendation-block-name-font-family-control", c.NAME_PADDINGS = "recommendation-block-name-paddings-control", c.NAME_SIZE = "recommendation-block-name-size-control", c.NAME_STYLE = "recommendation-block-name-style-control", c.NAME_TEXT_TRIM = "recommendation-block-name-text-trim-control", c.PRICE_ALIGN = "recommendation-block-price-align-control", c.PRICE_BACKGROUND = "recommendation-block-price-background-control", c.PRICE_COLOR = "recommendation-block-price-color-control", c.PRICE_FONT_FAMILY = "recommendation-block-price-font-family-control", c.PRICE_PADDINGS = "recommendation-block-price-paddings-control", c.PRICE_SIZE = "recommendation-block-price-size-control", c.PRICE_STYLE = "recommendation-block-price-style-control", c.OLD_PRICE_ALIGN = "recommendation-block-old-price-align-control", c.OLD_PRICE_BACKGROUND = "recommendation-block-old-price-background-control", c.OLD_PRICE_COLOR = "recommendation-block-old-price-color-control", c.OLD_PRICE_FONT_FAMILY = "recommendation-block-old-price-font-family-control", c.OLD_PRICE_PADDINGS = "recommendation-block-old-price-paddings-control", c.OLD_PRICE_SIZE = "recommendation-block-old-price-size-control", c.OLD_PRICE_STYLE = "recommendation-block-old-price-style-control", c.OMNIBUS_PRICE_ALIGN = "recommendation-block-omnibus-price-align-control", c.OMNIBUS_PRICE_BACKGROUND = "recommendation-block-omnibus-price-background-control", c.OMNIBUS_PRICE_COLOR = "recommendation-block-omnibus-price-color-control", c.OMNIBUS_PRICE_FONT_FAMILY = "recommendation-block-omnibus-price-font-family-control", c.OMNIBUS_PRICE_PADDINGS = "recommendation-block-omnibus-price-paddings-control", c.OMNIBUS_PRICE_SIZE = "recommendation-block-omnibus-price-size-control", c.OMNIBUS_PRICE_STYLE = "recommendation-block-omnibus-price-style-control", c.OMNIBUS_PRICE_TEXT_BEFORE = "recommendation-block-omnibus-price-text-before-control", c.OMNIBUS_PRICE_TEXT_AFTER = "recommendation-block-omnibus-price-text-after-control", c.OMNIBUS_DISCOUNT_ALIGN = "recommendation-block-omnibus-discount-align-control", c.OMNIBUS_DISCOUNT_BACKGROUND = "recommendation-block-omnibus-discount-background-control", c.OMNIBUS_DISCOUNT_COLOR = "recommendation-block-omnibus-discount-color-control", c.OMNIBUS_DISCOUNT_FONT_FAMILY = "recommendation-block-omnibus-discount-font-family-control", c.OMNIBUS_DISCOUNT_PADDINGS = "recommendation-block-omnibus-discount-paddings-control", c.OMNIBUS_DISCOUNT_SIZE = "recommendation-block-omnibus-discount-size-control", c.OMNIBUS_DISCOUNT_STYLE = "recommendation-block-omnibus-discount-style-control", c.OMNIBUS_DISCOUNT_TEXT_BEFORE = "recommendation-block-omnibus-discount-text-before-control", c.OMNIBUS_DISCOUNT_TEXT_AFTER = "recommendation-block-omnibus-discount-text-after-control", c.IMAGE_SIZE = "recommendation-block-image-size-control", c.IMAGE_MARGINS = "recommendation-block-image-margins-control", c.CUSTOM_ATTR_ALIGN = "recommendation-block-custom-attr-align-control", c.CUSTOM_ATTR_BACKGROUND = "recommendation-block-custom-attr-background-control", c.CUSTOM_ATTR_COLOR = "recommendation-block-custom-attr-color-control", c.CUSTOM_ATTR_FONT_FAMILY = "recommendation-block-custom-attr-font-family-control", c.CUSTOM_ATTR_PADDINGS = "recommendation-block-custom-attr-paddings-control", c.CUSTOM_ATTR_SIZE = "recommendation-block-custom-attr-size-control", c.CUSTOM_ATTR_STYLE = "recommendation-block-custom-attr-style-control", c.CUSTOM_ATTR_TEXT_TRIM = "recommendation-block-custom-attr-text-trim-control", c.SYNC_INFO_MESSAGE = "recommendation-block-sync-info-message", c))(o || {});
+var o = /* @__PURE__ */ ((c) => (c.BUTTON_ALIGN = "recommendation-block-button-align-control", c.BUTTON_BORDER = "recommendation-block-button-border-control", c.BUTTON_BORDER_RADIUS = "recommendation-block-button-border-radius-control", c.BUTTON_COLOR = "recommendation-block-button-color-control", c.BUTTON_FIT_TO_CONTENT = "recommendation-block-button-fit-to-content-control", c.BUTTON_FONT_FAMILY = "recommendation-block-button-font-family-control", c.BUTTON_MARGINS = "recommendation-block-button-margins-control", c.BUTTON_PADDINGS = "recommendation-block-button-paddings-control", c.BUTTON_TEXT = "recommendation-block-button-text-control", c.BUTTON_TEXT_SIZE = "recommendation-block-button-text-size-control", c.BUTTON_TEXT_STYLE_AND_FONT_COLOR = "recommendation-block-button-text-style-and-font-color-control", c.NAME_ALIGN = "recommendation-block-name-align-control", c.NAME_BACKGROUND = "recommendation-block-name-background-control", c.NAME_COLOR = "recommendation-block-name-color-control", c.NAME_FONT_FAMILY = "recommendation-block-name-font-family-control", c.NAME_PADDINGS = "recommendation-block-name-paddings-control", c.NAME_SIZE = "recommendation-block-name-size-control", c.NAME_STYLE = "recommendation-block-name-style-control", c.NAME_TEXT_TRIM = "recommendation-block-name-text-trim-control", c.PRICE_ALIGN = "recommendation-block-price-align-control", c.PRICE_BACKGROUND = "recommendation-block-price-background-control", c.PRICE_COLOR = "recommendation-block-price-color-control", c.PRICE_FONT_FAMILY = "recommendation-block-price-font-family-control", c.PRICE_PADDINGS = "recommendation-block-price-paddings-control", c.PRICE_SIZE = "recommendation-block-price-size-control", c.PRICE_STYLE = "recommendation-block-price-style-control", c.OLD_PRICE_ALIGN = "recommendation-block-old-price-align-control", c.OLD_PRICE_BACKGROUND = "recommendation-block-old-price-background-control", c.OLD_PRICE_COLOR = "recommendation-block-old-price-color-control", c.OLD_PRICE_FONT_FAMILY = "recommendation-block-old-price-font-family-control", c.OLD_PRICE_PADDINGS = "recommendation-block-old-price-paddings-control", c.OLD_PRICE_SIZE = "recommendation-block-old-price-size-control", c.OLD_PRICE_STYLE = "recommendation-block-old-price-style-control", c.OMNIBUS_PRICE_ALIGN = "recommendation-block-omnibus-price-align-control", c.OMNIBUS_PRICE_BACKGROUND = "recommendation-block-omnibus-price-background-control", c.OMNIBUS_PRICE_COLOR = "recommendation-block-omnibus-price-color-control", c.OMNIBUS_PRICE_FONT_FAMILY = "recommendation-block-omnibus-price-font-family-control", c.OMNIBUS_PRICE_PADDINGS = "recommendation-block-omnibus-price-paddings-control", c.OMNIBUS_PRICE_SIZE = "recommendation-block-omnibus-price-size-control", c.OMNIBUS_PRICE_STYLE = "recommendation-block-omnibus-price-style-control", c.OMNIBUS_PRICE_TEXT_BEFORE = "recommendation-block-omnibus-price-text-before-control", c.OMNIBUS_PRICE_TEXT_AFTER = "recommendation-block-omnibus-price-text-after-control", c.OMNIBUS_DISCOUNT_ALIGN = "recommendation-block-omnibus-discount-align-control", c.OMNIBUS_DISCOUNT_BACKGROUND = "recommendation-block-omnibus-discount-background-control", c.OMNIBUS_DISCOUNT_COLOR = "recommendation-block-omnibus-discount-color-control", c.OMNIBUS_DISCOUNT_FONT_FAMILY = "recommendation-block-omnibus-discount-font-family-control", c.OMNIBUS_DISCOUNT_PADDINGS = "recommendation-block-omnibus-discount-paddings-control", c.OMNIBUS_DISCOUNT_SIZE = "recommendation-block-omnibus-discount-size-control", c.OMNIBUS_DISCOUNT_STYLE = "recommendation-block-omnibus-discount-style-control", c.OMNIBUS_DISCOUNT_TEXT_BEFORE = "recommendation-block-omnibus-discount-text-before-control", c.OMNIBUS_DISCOUNT_TEXT_AFTER = "recommendation-block-omnibus-discount-text-after-control", c.IMAGE_SIZE = "recommendation-block-image-size-control", c.IMAGE_MARGINS = "recommendation-block-image-margins-control", c.CUSTOM_ATTR_ALIGN = "recommendation-block-custom-attr-align-control", c.CUSTOM_ATTR_BACKGROUND = "recommendation-block-custom-attr-background-control", c.CUSTOM_ATTR_COLOR = "recommendation-block-custom-attr-color-control", c.CUSTOM_ATTR_FONT_FAMILY = "recommendation-block-custom-attr-font-family-control", c.CUSTOM_ATTR_PADDINGS = "recommendation-block-custom-attr-paddings-control", c.CUSTOM_ATTR_SIZE = "recommendation-block-custom-attr-size-control", c.CUSTOM_ATTR_STYLE = "recommendation-block-custom-attr-style-control", c.SYNC_INFO_MESSAGE = "recommendation-block-sync-info-message", c))(o || {});
 export {
   o as RecommendationControlId
 };

package/dist/extensions/Blocks/Recommendation/controls/customAttribute/index.js

@@ -1,22 +1,21 @@
-import { TextPaddingsBuiltInControl as d, ButtonBackgroundColorBuiltInControl as i, TextFontFamilyBuiltInControl as u, TextStyleBuiltInControl as c, TextSizeBuiltInControl as C, TextColorBuiltInControl as g, TextAlignBuiltInControl as a } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { TextPaddingsBuiltInControl as d, ButtonBackgroundColorBuiltInControl as c, TextFontFamilyBuiltInControl as u, TextStyleBuiltInControl as i, TextSizeBuiltInControl as C, TextColorBuiltInControl as g, TextAlignBuiltInControl as a } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { RecommendationBlockId as l } from "../../constants/blockIds.js";
 import { RecommendationControlId as e } from "../../constants/controlIds.js";
-import { BLOCK_ROOT_SELECTOR as A, ATTR_PRODUCT_ATTR as s } from "../../constants/selectors.js";
-import { CustomAttributeTextTrimControl as I } from "./textTrim.js";
+import { BLOCK_ROOT_SELECTOR as I, ATTR_PRODUCT_ATTR as s } from "../../constants/selectors.js";
 function o(t) {
-  const r = t.closest(A);
-  if (!r)
+  const n = t.closest(I);
+  if (!n)
     return [];
-  const n = t.asElement().getAttribute(s);
-  if (n) {
-    const T = `[esd-extension-block-id="${l.CUSTOM_ATTRIBUTE}"][${s}="${n}"]`;
-    return r.querySelectorAll(T);
+  const r = t.asElement().getAttribute(s);
+  if (r) {
+    const T = `[esd-extension-block-id="${l.CUSTOM_ATTRIBUTE}"][${s}="${r}"]`;
+    return n.querySelectorAll(T);
   }
-  return r.querySelectorAll(
+  return n.querySelectorAll(
     `[esd-extension-block-id="${l.CUSTOM_ATTRIBUTE}"]`
   );
 }
-const m = class extends a {
+const A = class extends a {
   getId() {
     return e.CUSTOM_ATTR_ALIGN;
   }
@@ -37,7 +36,7 @@ const m = class extends a {
   getTargetNodes(t) {
     return o(t);
   }
-}, x = class extends c {
+}, m = class extends i {
   getId() {
     return e.CUSTOM_ATTR_STYLE;
   }
@@ -51,31 +50,29 @@ const m = class extends a {
   getTargetNodes(t) {
     return o(t);
   }
-}, R = class extends i {
+}, R = class extends c {
   getId() {
     return e.CUSTOM_ATTR_BACKGROUND;
   }
   getTargetNodes(t) {
     return o(t);
   }
-}, B = class extends d {
+}, x = class extends d {
   getId() {
     return e.CUSTOM_ATTR_PADDINGS;
   }
   getTargetNodes(t) {
     return o(t);
   }
-}, p = {
-  align: m,
+}, k = {
+  align: A,
   color: _,
   size: S,
-  style: x,
+  style: m,
   fontFamily: O,
   background: R,
-  paddings: B,
-  textTrim: I
+  paddings: x
 };
 export {
-  p as CustomAttributeControls,
-  I as CustomAttributeTextTrimControl
+  k as CustomAttributeControls
 };

package/dist/extensions/Blocks/Recommendation/controls/main/algorithm.js

@@ -1,7 +1,7 @@
-var l = Object.defineProperty;
-var c = (s, i, t) => i in s ? l(s, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[i] = t;
-var a = (s, i, t) => c(s, typeof i != "symbol" ? i + "" : i, t);
-import { UEAttr as h } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+var c = Object.defineProperty;
+var h = (s, i, t) => i in s ? c(s, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[i] = t;
+var a = (s, i, t) => h(s, typeof i != "symbol" ? i + "" : i, t);
+import { UEAttr as l } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { CommonControl as d } from "../../../common-control.js";
 import { RecommendationConfigService as n } from "../../services/configService.js";
 import { useRecommendationExtensionStore as m } from "../../store/recommendation.js";
@@ -42,7 +42,7 @@ class T extends d {
     this._initializeSelectItems(), this._setFormValues(), this._listenToFormUpdates();
   }
   onTemplateNodeUpdated(t) {
-    super.onTemplateNodeUpdated(t), this._initializeSelectItems(), this._setFormValues();
+    super.onTemplateNodeUpdated(t), this._setFormValues();
   }
   _setFormValues() {
     const t = n.getConfig(this.currentNode);
@@ -58,7 +58,7 @@ class T extends d {
       try {
         this.api.setUIEAttribute(
           e.ALGORITHM,
-          h.SELECTPICKER.items,
+          l.SELECTPICKER.items,
           t
         );
       } catch (r) {

package/dist/extensions/Blocks/Recommendation/controls/main/index.js

@@ -114,9 +114,7 @@ class H extends g {
     var r;
     super.onTemplateNodeUpdated(t);
     const e = this._getRecommendationIdFromNode(t);
-    e !== null && e !== this.store.currentRecommendationId && this.store.setCurrentBlock(e), e !== null && this._syncNodeConfigToStore(), e !== null && !((r = this.store.blockStates[e]) != null && r.isInitialized) && this._fetchBlockData(e).then(() => {
-      this._initializeSubControls();
-    }), [
+    e !== null && e !== this.store.currentRecommendationId && this.store.setCurrentBlock(e), this._syncNodeConfigToStore(), e !== null && !((r = this.store.blockStates[e]) != null && r.isInitialized) && this._fetchBlockData(e), [
       this.layoutOrientationControl,
       this.productCountControl,
       this.algorithmControl,

package/dist/extensions/Blocks/Recommendation/controls/name/textTrim.js

@@ -1,15 +1,14 @@
-import { ModificationDescription as l } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { CommonControl as u } from "../../../common-control.js";
-import { RecommendationBlockId as a } from "../../constants/blockIds.js";
-import { RecommendationControlId as d } from "../../constants/controlIds.js";
-import { BLOCK_ROOT_SELECTOR as m } from "../../constants/selectors.js";
-import { CSS_CLASS_TEXT_TRIM as r, ensureTextTrimCssRulesExist as T } from "../shared/textTrimCssRules.js";
-const s = {
+import { ModificationDescription as a } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { CommonControl as d } from "../../../common-control.js";
+import { RecommendationBlockId as l } from "../../constants/blockIds.js";
+import { RecommendationControlId as m } from "../../constants/controlIds.js";
+import { BLOCK_ROOT_SELECTOR as u } from "../../constants/selectors.js";
+const i = {
   TEXT_TRIM_ENABLED: "textTrimEnabled"
-};
-class N extends u {
+}, o = "text-trim-enabled", c = `.${o}`, T = `.${o} p`, p = `.${o} { max-width: 0; }`, _ = `.${o} p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; display: block; }`;
+class N extends d {
   getId() {
-    return d.NAME_TEXT_TRIM;
+    return m.NAME_TEXT_TRIM;
   }
   getTemplate() {
     return `
@@ -17,7 +16,7 @@ class N extends u {
             <div class="name-text-trim-control-container">
                 ${this._GuTwoColumns([
       this._GuLabel({ text: this.api.translate("Trim Long Text") }),
-      this._GuToggle(s.TEXT_TRIM_ENABLED)
+      this._GuToggle(i.TEXT_TRIM_ENABLED)
     ])}
             </div>
         `;
@@ -31,45 +30,76 @@ class N extends u {
   _setFormValues() {
     const e = this._getCurrentTrimState();
     this.api.updateValues({
-      [s.TEXT_TRIM_ENABLED]: e
+      [i.TEXT_TRIM_ENABLED]: e
     });
   }
   _getCurrentTrimState() {
     if (!this.currentNode || !("hasClass" in this.currentNode))
       return !1;
-    if (this.currentNode.hasClass(r))
+    if (this.currentNode.hasClass(o))
       return !0;
-    const e = this.currentNode.closest(m);
+    const e = this.currentNode.closest(u);
     if (!e)
       return !1;
     const t = e.querySelector(
-      `[esd-extension-block-id="${a.NAME}"]`
+      `[esd-extension-block-id="${l.NAME}"]`
     );
-    return t && "hasClass" in t ? t.hasClass(r) : !1;
+    return t && "hasClass" in t ? t.hasClass(o) : !1;
+  }
+  /**
+   * Finds an existing CSS rule in the document stylesheet by exact query
+   * @param query - The CSS query to search for (uses Stripo's CSS query syntax)
+   * @returns The CSS rule node if found, undefined otherwise
+   */
+  _findCssRule(e) {
+    const t = this.api.getDocumentRootCssNode();
+    if (t)
+      return t.querySelector(e);
+  }
+  /**
+   * Finds the .text-trim-enabled p rule by searching all text-trim rules and comparing selectors
+   * This is needed because Stripo's CSS query syntax interprets spaces as path separators
+   * @returns true if the rule exists
+   */
+  _hasParagraphRule() {
+    const e = this.api.getDocumentRootCssNode();
+    return e ? e.querySelectorAll(`*${o}`).some((s) => "getSelector" in s && typeof s.getSelector == "function" ? s.getSelector() === T : !1) : !1;
+  }
+  /**
+   * Ensures the text-trim CSS rules exist in the document stylesheet
+   * Only adds rules if they don't already exist (prevents duplicates across multiple blocks)
+   */
+  _ensureCssRulesExist() {
+    const e = this.api.getDocumentRootCssNode();
+    if (!e)
+      return;
+    const t = this.api.getDocumentModifier();
+    let s = !1;
+    this._findCssRule(c) || (t.modifyCss(e).appendRule(p), s = !0), this._hasParagraphRule() || (t.modifyCss(e).appendRule(_), s = !0), s && t.apply(new a("Add text trim CSS rules"));
   }
   _onTextTrimChange(e) {
     if (!this.currentNode || !("closest" in this.currentNode))
       return;
-    const t = this.currentNode.closest(m);
+    const t = this.currentNode.closest(u);
     if (!t || !("querySelectorAll" in t))
       return;
-    const i = Array.from(
-      t.querySelectorAll(`[esd-extension-block-id="${a.NAME}"]`)
+    const s = Array.from(
+      t.querySelectorAll(`[esd-extension-block-id="${l.NAME}"]`)
     );
-    if (!i.length)
+    if (!s.length)
       return;
-    e && T(this.api);
-    const o = this.api.getDocumentModifier();
-    i.forEach((n) => {
-      e ? o.modifyHtml(n).setClass(r) : o.modifyHtml(n).removeClass(r);
-    }), o.apply(
-      new l(
+    e && this._ensureCssRulesExist();
+    const r = this.api.getDocumentModifier();
+    s.forEach((n) => {
+      e ? r.modifyHtml(n).setClass(o) : r.modifyHtml(n).removeClass(o);
+    }), r.apply(
+      new a(
         e ? "Enable product name text trimming" : "Disable product name text trimming"
       )
     );
   }
   _listenToFormUpdates() {
-    this.api.onValueChanged(s.TEXT_TRIM_ENABLED, (e) => {
+    this.api.onValueChanged(i.TEXT_TRIM_ENABLED, (e) => {
       this._onTextTrimChange(e);
     });
   }

package/dist/extensions/Blocks/Recommendation/settingsPanel.js

@@ -1,6 +1,6 @@
 import { SettingsPanelRegistry as E, SettingsPanelTab as _, SettingsTab as O, ContainerControls as C, TextControls as R } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { BLOCK_ID as U } from "./block.js";
-import { RecommendationBlockId as S } from "./constants/blockIds.js";
+import { RecommendationBlockId as N } from "./constants/blockIds.js";
 import { RecommendationControlId as T } from "./constants/controlIds.js";
 import { CONTROL_BLOCK_ID as A } from "./controls/main/index.js";
 import "./store/recommendation.js";
@@ -14,7 +14,7 @@ import "./controls/image/index.js";
 import { SPACING_CONTROL_ID as L } from "./controls/spacing/index.js";
 import { CARD_BACKGROUND_COLOR_CONTROL_ID as D } from "./controls/cardBackground/index.js";
 import { COMPOSITION_CONTROL_BLOCK_ID as B } from "./controls/cardComposition/index.js";
-import { SYNC_INFO_MESSAGE_CONTROL_ID as N } from "./controls/syncInfoMessage.js";
+import { SYNC_INFO_MESSAGE_CONTROL_ID as S } from "./controls/syncInfoMessage.js";
 class Z extends E {
   registerBlockControls(I) {
     I[U] = [
@@ -39,11 +39,11 @@ class Z extends E {
           B
         ]
       ).withLabel(this.api.translate("Card Composition"))
-    ], I[S.NAME] = [
+    ], I[N.NAME] = [
       new _(
         O.SETTINGS,
         [
-          N,
+          S,
           T.NAME_STYLE,
           T.NAME_ALIGN,
           T.NAME_TEXT_TRIM,
@@ -59,11 +59,11 @@ class Z extends E {
           T.NAME_COLOR
         ]
       )
-    ], I[S.PRICE] = [
+    ], I[N.PRICE] = [
       new _(
         O.SETTINGS,
         [
-          N,
+          S,
           T.PRICE_STYLE,
           T.PRICE_ALIGN,
           T.PRICE_PADDINGS
@@ -78,11 +78,11 @@ class Z extends E {
           T.PRICE_COLOR
         ]
       )
-    ], I[S.OLD_PRICE] = [
+    ], I[N.OLD_PRICE] = [
       new _(
         O.SETTINGS,
         [
-          N,
+          S,
           T.OLD_PRICE_STYLE,
           T.OLD_PRICE_ALIGN,
           T.OLD_PRICE_PADDINGS
@@ -97,11 +97,11 @@ class Z extends E {
           T.OLD_PRICE_COLOR
         ]
       )
-    ], I[S.OMNIBUS_PRICE] = [
+    ], I[N.OMNIBUS_PRICE] = [
       new _(
         O.SETTINGS,
         [
-          N,
+          S,
           T.OMNIBUS_PRICE_TEXT_BEFORE,
           T.OMNIBUS_PRICE_TEXT_AFTER,
           T.OMNIBUS_PRICE_STYLE,
@@ -118,11 +118,11 @@ class Z extends E {
           T.OMNIBUS_PRICE_COLOR
         ]
       )
-    ], I[S.OMNIBUS_DISCOUNT] = [
+    ], I[N.OMNIBUS_DISCOUNT] = [
       new _(
         O.SETTINGS,
         [
-          N,
+          S,
           T.OMNIBUS_DISCOUNT_TEXT_BEFORE,
           T.OMNIBUS_DISCOUNT_TEXT_AFTER,
           T.OMNIBUS_DISCOUNT_STYLE,
@@ -139,11 +139,11 @@ class Z extends E {
           T.OMNIBUS_DISCOUNT_COLOR
         ]
       )
-    ], I[S.BUTTON] = [
+    ], I[N.BUTTON] = [
       new _(
         O.SETTINGS,
         [
-          N,
+          S,
           T.BUTTON_TEXT,
           T.BUTTON_ALIGN,
           T.BUTTON_PADDINGS,
@@ -162,13 +162,12 @@ class Z extends E {
           T.BUTTON_BORDER
         ]
       )
-    ], I[S.CUSTOM_ATTRIBUTE] = [
+    ], I[N.CUSTOM_ATTRIBUTE] = [
       new _(
         O.SETTINGS,
         [
           T.CUSTOM_ATTR_STYLE,
           T.CUSTOM_ATTR_ALIGN,
-          T.CUSTOM_ATTR_TEXT_TRIM,
           T.CUSTOM_ATTR_PADDINGS
         ]
       ),
@@ -181,11 +180,11 @@ class Z extends E {
           T.CUSTOM_ATTR_COLOR
         ]
       )
-    ], I[S.IMAGE] = [
+    ], I[N.IMAGE] = [
       new _(
         O.SETTINGS,
         [
-          N,
+          S,
           T.IMAGE_SIZE,
           T.IMAGE_MARGINS
         ]

package/dist/extensions/Blocks/Recommendation/store/recommendation.js

@@ -1,14 +1,14 @@
 import { RecommendationFeedSourceMaps as g, getOperatorOptions as R, PriceAttributes as k } from "../../../../enums/extensions/recommendationBlock.js";
-import { useRecommendationApi as C } from "../../../../services/recommendationApi.js";
-import { useConfigStore as y } from "../../../../stores/config.js";
+import { useRecommendationApi as y } from "../../../../services/recommendationApi.js";
+import { useConfigStore as C } from "../../../../stores/config.js";
 import { defineStore as G } from "pinia";
 import { DEFAULT_CARDS_IN_ROW as F } from "../constants/layout.js";
 import { EXCLUDED_ALGORITHM_IDS as w } from "../constants/defaultConfig.js";
 import { getDefaultProducts as S } from "../templates/utils.js";
 import { generateCompleteFilterQuery as b } from "../utils/filterUtil.js";
 import { isFilterValid as D } from "../validation/filterSchema.js";
-const h = C();
-let m = null, u = null, d = null;
+const h = y();
+let u = null, m = null, d = null;
 function I() {
   return {
     cardsInRow: F,
@@ -57,7 +57,7 @@ const v = () => ({
   blockStates: {},
   currentRecommendationId: null,
   configVersion: 0
-}), z = G("guidoRecommendationExtension", {
+}), E = G("guidoRecommendationExtension", {
   state: () => v(),
   getters: {
     // ====================================================================
@@ -131,10 +131,11 @@ const v = () => ({
     })),
     getFilterList() {
       return Object.values(this.filterList).map((t) => {
-        let r;
-        return t.type === "productAttribute" ? r = `product_attributes.${t.attributeName}` : k.includes(t.attributeName) ? r = `${t.attributeName}.${this.recommendationConfigs.currencySettings.value}` : r = t.attributeName, {
+        const r = t.type === "defaultAttribute", e = k.includes(t.attributeName);
+        let n = r ? t.attributeName : `product_attributes.${t.attributeName}`;
+        return n = e ? `${n}.${this.recommendationConfigs.currencySettings.value}` : n, {
           text: t.displayName,
-          value: r,
+          value: n,
           type: t.attributeType
         };
       });
@@ -162,15 +163,10 @@ const v = () => ({
      * Resets currentRecommendationId if it was the deleted block.
      */
     removeBlockState(t) {
-      const r = t.toString();
-      if (this.recommendationCampaignUrls[r]) {
-        const n = { ...this.recommendationCampaignUrls };
-        delete n[r], this.recommendationCampaignUrls = n;
-      }
-      const e = { ...this.blockStates };
-      if (delete e[t], this.blockStates = e, this.currentRecommendationId === t) {
-        const n = Object.keys(this.blockStates).map(Number);
-        this.currentRecommendationId = n.length > 0 ? n[0] : null;
+      const r = { ...this.blockStates };
+      if (delete r[t], this.blockStates = r, this.currentRecommendationId === t) {
+        const e = Object.keys(this.blockStates).map(Number);
+        this.currentRecommendationId = e.length > 0 ? e[0] : null;
       }
     },
     /**
@@ -255,11 +251,11 @@ const v = () => ({
     // ====================================================================
     async fetchRecommendationCreateData() {
       if (!this.activePredictiveAlgorithms.length) {
-        if (m) {
-          await m;
+        if (u) {
+          await u;
           return;
         }
-        m = (async () => {
+        u = (async () => {
           const {
             activePredictiveAlgorithms: t,
             languages: r,
@@ -272,26 +268,26 @@ const v = () => ({
           this.currencyList = e;
         })();
         try {
-          await m;
+          await u;
         } finally {
-          m = null;
+          u = null;
         }
       }
     },
     async fetchRecommendationFilters() {
       if (!Object.keys(this.filterList).length) {
-        if (u) {
-          await u;
+        if (m) {
+          await m;
           return;
         }
-        u = (async () => {
+        m = (async () => {
           const t = await h.fetchRecommendationFilters();
           this.filterList = t;
         })();
         try {
-          await u;
+          await m;
         } finally {
-          u = null;
+          m = null;
         }
       }
     },
@@ -379,7 +375,7 @@ const v = () => ({
     },
     async _doFetchProducts() {
       var p;
-      const t = this.currentRecommendationId, r = this.blockStates[t], { recommendationConfigs: e } = r, n = e.filters.filter((a) => a.isValid), c = b(n), i = ((p = g.find((a) => a.key === e.strategy)) == null ? void 0 : p.path) || "", o = y(), s = {
+      const t = this.currentRecommendationId, r = this.blockStates[t], { recommendationConfigs: e } = r, n = e.filters.filter((a) => a.isValid), c = b(n), i = ((p = g.find((a) => a.key === e.strategy)) == null ? void 0 : p.path) || "", o = C(), s = {
         locale: e.language,
         currency: e.currencySettings.value,
         partnerName: o.partnerName,
@@ -403,5 +399,5 @@ const v = () => ({
   }
 });
 export {
-  z as useRecommendationExtensionStore
+  E as useRecommendationExtensionStore
 };

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

@@ -1,7 +1,7 @@
-import { ATTR_PRODUCT_IMAGE as a, ATTR_PRODUCT_BUTTON as d } from "../../constants/selectors.js";
-import { DEFAULT_CARD_COMPOSITION as b, spacer as m, buildElementRenderer as C, DEFAULT_CARD_VISIBILITY as T } from "../utils.js";
-import { listElementRenderer as f } from "./elementRenderer.js";
-function R(r, n, l) {
+import { ATTR_PRODUCT_IMAGE as d, ATTR_PRODUCT_BUTTON as a } from "../../constants/selectors.js";
+import { DEFAULT_CARD_COMPOSITION as m, spacer as C, buildElementRenderer as b, DEFAULT_CARD_VISIBILITY as T } from "../utils.js";
+import { listElementRenderer as R } from "./elementRenderer.js";
+function f(r, n, l) {
   const t = l ? "" : ' style="display: none;"', o = r.replace(/<tr>/, "").replace(/<\/tr>/, "");
   return `<tr
             class="recommendation-attribute-row"
@@ -26,26 +26,26 @@ const y = `
         </td>
     </tr>
 `;
-function O(r, n = b, l = {}) {
-  const t = C(f, n, l), o = t[a](r), c = `
+function O(r, n = m, l = {}) {
+  const t = b(R, n, l), o = t[d](r), c = `
         <td class="product-info-cell" valign="middle" style="padding: 15px;">
-            <table cellpadding="0" cellspacing="0" role="presentation" width="100%" style="table-layout: fixed;">
+            <table cellpadding="0" cellspacing="0" role="presentation" width="100%">
                 <tbody>
-                    ${n.filter((e) => e !== a && e !== d).filter((e) => t[e]).map((e) => {
+                    ${n.filter((e) => e !== d && e !== a).filter((e) => t[e]).map((e) => {
     const u = T[e] ?? !0;
-    return R(t[e](r), e, u);
+    return f(t[e](r), e, u);
   }).join(`
                     `)}
                 </tbody>
             </table>
         </td>
-    `, s = t[d](r), p = o + c + s;
+    `, s = t[a](r), p = o + c + s;
   return y.replace("{-{-PRODUCT_CONTENT-}-}", p);
 }
 function D(r, n, l = {}) {
   return r.map((t, o) => {
     const i = O(t, n, l);
-    return o > 0 ? m + i : i;
+    return o > 0 ? C + i : i;
   }).join("");
 }
 export {

package/dist/src/extensions/Blocks/Recommendation/constants/controlIds.d.ts

@@ -63,6 +63,5 @@ export declare enum RecommendationControlId {
     CUSTOM_ATTR_PADDINGS = "recommendation-block-custom-attr-paddings-control",
     CUSTOM_ATTR_SIZE = "recommendation-block-custom-attr-size-control",
     CUSTOM_ATTR_STYLE = "recommendation-block-custom-attr-style-control",
-    CUSTOM_ATTR_TEXT_TRIM = "recommendation-block-custom-attr-text-trim-control",
     SYNC_INFO_MESSAGE = "recommendation-block-sync-info-message"
 }

package/dist/src/extensions/Blocks/Recommendation/controls/customAttribute/index.d.ts

@@ -13,12 +13,10 @@
  * product cards — changing "brand" color won't affect "rating_star" color.
  */
 import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
-import { CustomAttributeTextTrimControl } from './textTrim';
 /**
  * Grouped Custom Attribute Controls
  * Use this object for cleaner imports in extension.ts
  */
-export { CustomAttributeTextTrimControl } from './textTrim';
 export declare const CustomAttributeControls: {
     readonly align: {
         new (): {
@@ -104,5 +102,4 @@ export declare const CustomAttributeControls: {
             isVisible(_node: ImmutableHtmlNode): boolean;
         };
     };
-    readonly textTrim: typeof CustomAttributeTextTrimControl;
 };

package/dist/src/extensions/Blocks/Recommendation/controls/name/textTrim.d.ts

@@ -1,9 +1,9 @@
-import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
+import { ImmutableCssNode, ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
 import { CommonControl } from '../../../common-control';
 /**
- * Control for enabling/disabling text trimming on product names.
+ * Control for enabling/disabling text trimming on product names
  * When enabled, adds a CSS class that applies text-overflow: ellipsis
- * and injects the required CSS rules into the document stylesheet.
+ * and injects the required CSS rules into the document stylesheet
  */
 export declare class NameTextTrimControl extends CommonControl {
     getId(): string;
@@ -12,6 +12,23 @@ export declare class NameTextTrimControl extends CommonControl {
     onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
     _setFormValues(): void;
     _getCurrentTrimState(): boolean;
+    /**
+     * Finds an existing CSS rule in the document stylesheet by exact query
+     * @param query - The CSS query to search for (uses Stripo's CSS query syntax)
+     * @returns The CSS rule node if found, undefined otherwise
+     */
+    _findCssRule(query: string): ImmutableCssNode | undefined;
+    /**
+     * Finds the .text-trim-enabled p rule by searching all text-trim rules and comparing selectors
+     * This is needed because Stripo's CSS query syntax interprets spaces as path separators
+     * @returns true if the rule exists
+     */
+    _hasParagraphRule(): boolean;
+    /**
+     * Ensures the text-trim CSS rules exist in the document stylesheet
+     * Only adds rules if they don't already exist (prevents duplicates across multiple blocks)
+     */
+    _ensureCssRulesExist(): void;
     _onTextTrimChange(enabled: boolean): void;
     _listenToFormUpdates(): void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.2.0-beta.22a0c4c",
+  "version": "3.2.0-beta.250b0a1",
   "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",

package/dist/extensions/Blocks/Recommendation/controls/customAttribute/textTrim.js

@@ -1,99 +0,0 @@
-import { ModificationDescription as T } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { CommonControl as m } from "../../../common-control.js";
-import { RecommendationBlockId as n } from "../../constants/blockIds.js";
-import { RecommendationControlId as l } from "../../constants/controlIds.js";
-import { BLOCK_ROOT_SELECTOR as u, ATTR_PRODUCT_ATTR as a } from "../../constants/selectors.js";
-import { CSS_CLASS_TEXT_TRIM as o, ensureTextTrimCssRulesExist as c } from "../shared/textTrimCssRules.js";
-const i = {
-  TEXT_TRIM_ENABLED: "customAttrTextTrimEnabled"
-};
-class g extends m {
-  getId() {
-    return l.CUSTOM_ATTR_TEXT_TRIM;
-  }
-  getTemplate() {
-    return `
-            <hr style="margin: 0; border: none; border-top: 1px solid #e0e0e0;" />
-            <div class="custom-attr-text-trim-control-container">
-                ${this._GuTwoColumns([
-      this._GuLabel({ text: this.api.translate("Trim Long Text") }),
-      this._GuToggle(i.TEXT_TRIM_ENABLED)
-    ])}
-            </div>
-        `;
-  }
-  onRender() {
-    this._setFormValues(), this._listenToFormUpdates();
-  }
-  onTemplateNodeUpdated(t) {
-    super.onTemplateNodeUpdated(t), this._setFormValues();
-  }
-  // ========================================================================
-  // State Reading
-  // ========================================================================
-  _setFormValues() {
-    this.api.updateValues({
-      [i.TEXT_TRIM_ENABLED]: this._getCurrentTrimState()
-    });
-  }
-  _getCurrentTrimState() {
-    if (!this.currentNode || !("hasClass" in this.currentNode))
-      return !1;
-    if (this.currentNode.hasClass(o))
-      return !0;
-    const t = this._getTargetElements();
-    return t.length > 0 && "hasClass" in t[0] ? t[0].hasClass(o) : !1;
-  }
-  // ========================================================================
-  // Target Element Discovery (per-attribute scoping)
-  // ========================================================================
-  /**
-   * Finds all custom attribute elements of the same type as the current node.
-   *
-   * Similar to getCustomAttrTargetNodes in customAttribute/index.ts, but adapted
-   * for CommonControl lifecycle where currentNode is a class property (not a
-   * parameter from Stripo's getTargetNodes override).
-   */
-  _getTargetElements() {
-    if (!this.currentNode || !("closest" in this.currentNode))
-      return [];
-    const t = this.currentNode.closest(u);
-    if (!t)
-      return [];
-    const e = "asElement" in this.currentNode ? this.currentNode.asElement().getAttribute(a) : null;
-    if (e) {
-      const s = `[esd-extension-block-id="${n.CUSTOM_ATTRIBUTE}"][${a}="${e}"]`;
-      return Array.from(t.querySelectorAll(s));
-    }
-    return Array.from(
-      t.querySelectorAll(
-        `[esd-extension-block-id="${n.CUSTOM_ATTRIBUTE}"]`
-      )
-    );
-  }
-  // ========================================================================
-  // Toggle Handler
-  // ========================================================================
-  _onTextTrimChange(t) {
-    const e = this._getTargetElements();
-    if (!e.length)
-      return;
-    t && c(this.api);
-    const r = this.api.getDocumentModifier();
-    e.forEach((s) => {
-      t ? r.modifyHtml(s).setClass(o) : r.modifyHtml(s).removeClass(o);
-    }), r.apply(
-      new T(
-        t ? "Enable custom attribute text trimming" : "Disable custom attribute text trimming"
-      )
-    );
-  }
-  _listenToFormUpdates() {
-    this.api.onValueChanged(i.TEXT_TRIM_ENABLED, (t) => {
-      this._onTextTrimChange(t);
-    });
-  }
-}
-export {
-  g as CustomAttributeTextTrimControl
-};

package/dist/extensions/Blocks/Recommendation/controls/shared/textTrimCssRules.js

@@ -1,14 +0,0 @@
-import { ModificationDescription as r } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-const t = "text-trim-enabled", l = `.${t}`, c = `.${t} p`, S = `.${t} { max-width: 0; }`, T = `.${t} p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0; display: block; }`;
-function f(n) {
-  const e = n.getDocumentRootCssNode();
-  if (!e)
-    return;
-  const o = n.getDocumentModifier();
-  let i = !1;
-  e.querySelector(l) || (o.modifyCss(e).appendRule(S), i = !0), e.querySelectorAll(`*${t}`).some((s) => "getSelector" in s && typeof s.getSelector == "function" && s.getSelector() === c) || (o.modifyCss(e).appendRule(T), i = !0), i && o.apply(new r("Add text trim CSS rules"));
-}
-export {
-  t as CSS_CLASS_TEXT_TRIM,
-  f as ensureTextTrimCssRulesExist
-};

package/dist/src/extensions/Blocks/Recommendation/controls/customAttribute/textTrim.d.ts

@@ -1,35 +0,0 @@
-/**
- * Custom Attribute Text Trim Control
- *
- * Per-attribute text trimming for custom product attributes.
- * Unlike NameTextTrimControl which applies to ALL product names globally,
- * this control is scoped to a specific custom attribute type via the
- * `product-attr` HTML attribute — changing text-trim on "brand" won't
- * affect "rating_star".
- *
- * CSS rules are shared with NameTextTrimControl via shared/textTrimCssRules.ts.
- */
-import { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
-import { CommonControl } from '../../../common-control';
-/**
- * Control for enabling/disabling text trimming on individual custom attributes.
- * Scoped per attribute type using the `product-attr` HTML attribute.
- */
-export declare class CustomAttributeTextTrimControl extends CommonControl {
-    getId(): string;
-    getTemplate(): string;
-    onRender(): void;
-    onTemplateNodeUpdated(node: ImmutableHtmlNode): void;
-    _setFormValues(): void;
-    _getCurrentTrimState(): boolean;
-    /**
-     * Finds all custom attribute elements of the same type as the current node.
-     *
-     * Similar to getCustomAttrTargetNodes in customAttribute/index.ts, but adapted
-     * for CommonControl lifecycle where currentNode is a class property (not a
-     * parameter from Stripo's getTargetNodes override).
-     */
-    _getTargetElements(): ImmutableHtmlNode[];
-    _onTextTrimChange(enabled: boolean): void;
-    _listenToFormUpdates(): void;
-}

package/dist/src/extensions/Blocks/Recommendation/controls/shared/textTrimCssRules.d.ts

@@ -1,29 +0,0 @@
-/**
- * Shared Text Trim CSS Rule Management
- *
- * Extracted from NameTextTrimControl to be reused by CustomAttributeTextTrimControl.
- * Follows the same pattern as controls/mobileLayout/cssRules.ts — standalone
- * functions that accept an API parameter, importable by any control class.
- *
- * The CSS rules are document-scoped (shared across all recommendation blocks).
- * Once injected, they persist until the template is closed.
- */
-import type { ImmutableCssNode } from '@stripoinc/ui-editor-extensions';
-import { ModificationDescription } from '@stripoinc/ui-editor-extensions';
-export declare const CSS_CLASS_TEXT_TRIM = "text-trim-enabled";
-interface CssCapableApi {
-    getDocumentRootCssNode: () => ImmutableCssNode | null;
-    getDocumentModifier: () => {
-        modifyCss: (node: ImmutableCssNode) => {
-            appendRule: (rule: string) => void;
-        };
-        apply: (desc: ModificationDescription) => void;
-    };
-}
-/**
- * Ensures the text-trim CSS rules exist in the document stylesheet.
- * Only adds rules if they don't already exist (prevents duplicates across blocks).
- * Calls getDocumentRootCssNode once and passes it to both checks.
- */
-export declare function ensureTextTrimCssRulesExist(api: CssCapableApi): void;
-export {};