@useinsider/guido 3.2.0-beta.2e5aafb → 3.2.0-beta.353f359

package/dist/config/migrator/radioButtonMigrator.js

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

package/dist/enums/onboarding.js

@@ -2,10 +2,15 @@ const e = [
   ".service-element.stacked-panel-item.ng-tns-c1014751574-3.level-bottom-0.ng-star-inserted",
   ".service-element.stacked-panel-item.ng-tns-c1014751574-3.level-bottom-1.ng-star-inserted",
   ".service-element.stacked-panel-item.ng-tns-c1014751574-3.level-bottom-2.ng-star-inserted"
-], t = "ui-editor", n = 'button[role="tab"][aria-label="Card Composition"]', s = 'button[role="tab"][aria-label="Settings"]', o = ".in-ribbons-wrapper";
+], t = "ui-editor", n = 'button[role="tab"][aria-label="Card Composition"]', s = 'button[role="tab"][aria-label="Settings"]', E = ".in-ribbons-wrapper", o = ".guido__amp-toggle-html", a = ".in-segments-wrapper", O = '[data-testid="guido-header"]', _ = 158, i = 10;
 export {
+  o as AMP_TOGGLE_BUTTON_SELECTOR,
+  a as AMP_TOGGLE_WRAPPER_SELECTOR,
   n as CARD_COMPOSITION_TAB_SELECTOR,
-  o as RIBBON_SELECTOR,
+  O as HEADER_SELECTOR,
+  _ as POPOVER_LEFT_OFFSET,
+  i as POPOVER_TOP_GAP,
+  E as RIBBON_SELECTOR,
   e as SERVICE_HOVER_SELECTORS,
   s as SETTINGS_TAB_SELECTOR,
   t as UI_EDITOR_SELECTOR

package/dist/extensions/Blocks/Items/controls/price/singlePrice.js

@@ -1,75 +1,75 @@
-import { ModificationDescription as m, UIElementType as _, UEAttr as A } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { CommonControl as h } from "../../../common-control.js";
-import { ItemsBlockControlId as L, ItemsBlockId as R } from "../../enums/controlEnums.js";
-import { productPairs as T } from "../../enums/productEnums.js";
-import { getItemsBlockConfig as I, setItemsBlockConfig as u, escapeReplacement as N } from "../../utils/nodeConfigUtils.js";
-const D = L.PRICE_SINGLE_PRICE, l = {
+import { ModificationDescription as S, UIElementType as d, UEAttr as m } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { CommonControl as A } from "../../../common-control.js";
+import { ItemsBlockControlId as T, ItemsBlockId as p } from "../../enums/controlEnums.js";
+import { productPairs as R } from "../../enums/productEnums.js";
+import { getItemsBlockConfig as I, setItemsBlockConfig as N, escapeReplacement as h } from "../../utils/nodeConfigUtils.js";
+const u = T.PRICE_SINGLE_PRICE, l = {
   SINGLE_PRICE: "singlePrice"
 };
-class y extends h {
+class k extends A {
   getId() {
-    return D;
+    return u;
   }
   getTemplate() {
     return `
-            <div class="container ${L.PRICE_SINGLE_PRICE}">
+            <div class="container ${T.PRICE_SINGLE_PRICE}">
                 ${this._getSinglePrice()}
             </div>
         `;
   }
   onRender() {
     const e = I(this.currentNode);
-    this.api.updateValues({ [l.SINGLE_PRICE]: (e == null ? void 0 : e.priceSinglePrice) ?? !1 }), this.api.onValueChanged(l.SINGLE_PRICE, (t) => {
-      this._onSinglePriceChange(t);
+    this.api.updateValues({ [l.SINGLE_PRICE]: (e == null ? void 0 : e.priceSinglePrice) ?? !1 }), this.api.onValueChanged(l.SINGLE_PRICE, (i) => {
+      this._onSinglePriceChange(i);
     });
   }
   onTemplateNodeUpdated(e) {
     super.onTemplateNodeUpdated(e), this.handleBlockInstanceChange(() => {
-      const t = I(this.currentNode);
-      this.api.updateValues({ [l.SINGLE_PRICE]: (t == null ? void 0 : t.priceSinglePrice) ?? !1 });
+      const i = I(this.currentNode);
+      this.api.updateValues({ [l.SINGLE_PRICE]: (i == null ? void 0 : i.priceSinglePrice) ?? !1 });
     });
   }
   _onSinglePriceChange(e) {
-    if (console.debug("Single price changed to: ", e), u(this.currentNode, this.api, { priceSinglePrice: e }), !this.currentNode)
+    if (console.debug("Single price changed to: ", e), !this.currentNode)
       return;
-    const t = I(this.currentNode), o = (t == null ? void 0 : t.type) ?? "CART_ITEMS", r = (t == null ? void 0 : t.priceFormatted) ?? !1, i = T.PAIRS_FOR_EXTENSION.price[o], c = T.PAIRS_FOR_EXTENSION.originalPrice[o], [P, p] = e ? [
-      r ? i.DEFAULT_PRICE_FORMATTED : i.DEFAULT_PRICE,
-      r ? i.DEFAULT_SINGLE_PRICE_FORMATTED : i.DEFAULT_SINGLE_PRICE
+    const i = I(this.currentNode), c = (i == null ? void 0 : i.type) ?? "CART_ITEMS", r = (i == null ? void 0 : i.priceFormatted) ?? !1, t = R.PAIRS_FOR_EXTENSION.price[c], n = R.PAIRS_FOR_EXTENSION.originalPrice[c], [E, g] = e ? [
+      r ? t.DEFAULT_PRICE_FORMATTED : t.DEFAULT_PRICE,
+      r ? t.DEFAULT_SINGLE_PRICE_FORMATTED : t.DEFAULT_SINGLE_PRICE
     ] : [
-      r ? i.DEFAULT_SINGLE_PRICE_FORMATTED : i.DEFAULT_SINGLE_PRICE,
-      r ? i.DEFAULT_PRICE_FORMATTED : i.DEFAULT_PRICE
-    ], s = r ? c.DEFAULT_PRICE_FORMATTED : c.DEFAULT_PRICE, d = r ? c.DEFAULT_SINGLE_PRICE_FORMATTED : c.DEFAULT_SINGLE_PRICE, [g, C] = e ? [s, d] : [d, s], n = this.currentNode.closest(".items-block"), S = (n == null ? void 0 : n.querySelectorAll(
-      `[esd-extension-block-id="${R.PRICE}"]`
-    )) || [], E = this.api.getDocumentModifier();
-    S.forEach((a) => {
-      this._updatePriceBlock(E, a, P, p, e);
-    }), ((n == null ? void 0 : n.querySelectorAll(
-      `[esd-extension-block-id="${R.ORIGINAL_PRICE}"]`
+      r ? t.DEFAULT_SINGLE_PRICE_FORMATTED : t.DEFAULT_SINGLE_PRICE,
+      r ? t.DEFAULT_PRICE_FORMATTED : t.DEFAULT_PRICE
+    ], P = r ? n.DEFAULT_PRICE_FORMATTED : n.DEFAULT_PRICE, _ = r ? n.DEFAULT_SINGLE_PRICE_FORMATTED : n.DEFAULT_SINGLE_PRICE, [L, C] = e ? [P, _] : [_, P], s = this.api.getDocumentModifier();
+    N(this.currentNode, this.api, { priceSinglePrice: e }, s);
+    const o = this.currentNode.closest(".items-block");
+    ((o == null ? void 0 : o.querySelectorAll(
+      `[esd-extension-block-id="${p.PRICE}"]`
     )) || []).forEach((a) => {
-      this._updatePriceBlock(E, a, g, C, e);
-    }), E.apply(new m(
+      this._updatePriceBlock(s, a, E, g, e);
+    }), ((o == null ? void 0 : o.querySelectorAll(
+      `[esd-extension-block-id="${p.ORIGINAL_PRICE}"]`
+    )) || []).forEach((a) => {
+      this._updatePriceBlock(s, a, L, C, e);
+    }), s.apply(new S(
       `Updated price to ${e ? "single" : "total"} price`
     ));
   }
-  _updatePriceBlock(e, t, o, r, i) {
-    const c = t.getInnerHTML().trim().replace(o, N(r));
-    e.modifyHtml(t).setInnerHtml(c), t.querySelectorAll('[product-attr="price"], [product-attr="originalPrice"]').forEach((s) => {
-      e.modifyHtml(s).setAttribute("data-single_price", i ? "true" : "false");
-    });
+  _updatePriceBlock(e, i, c, r, t) {
+    const n = `data-single_price="${t ? "true" : "false"}"`, E = i.getInnerHTML().trim().replace(c, h(r)).replace(/data-single_price=(?:"[^"]*"|'[^']*')/g, n);
+    e.modifyHtml(i).setInnerHtml(E);
   }
   _getSinglePrice() {
     return `
             <div class="display-flex align-items-center justify-content-between">
-                <${_.LABEL}
-                    ${A.LABEL.text}="${this.api.translate("Show Single Product Price")}"
+                <${d.LABEL}
+                    ${m.LABEL.text}="${this.api.translate("Show Single Product Price")}"
                 >
-                </${_.LABEL}>
+                </${d.LABEL}>
                 ${this._GuToggle(l.SINGLE_PRICE)}
             </div>
         `;
   }
 }
 export {
-  D as CONTROL_BLOCK_ID,
-  y as PriceSinglePriceControl
+  u as CONTROL_BLOCK_ID,
+  k as PriceSinglePriceControl
 };

package/dist/extensions/Blocks/Items/enums/productEnums.js

@@ -1,6 +1,6 @@
 import _ from "../../../../node_modules/lodash-es/flatMap.js";
-import a from "../../../../node_modules/lodash-es/range.js";
-const T = '<td align="center" class="ins-product-td items-block items-block-v2">', E = { PAIRS_FOR_EXTENSION: {
+import E from "../../../../node_modules/lodash-es/range.js";
+const T = '<td align="center" class="ins-product-td items-block items-block-v2">', a = { PAIRS_FOR_EXTENSION: {
   imageSrc: {
     CART_ITEMS: {
       ATTR: "ins_apr_img",
@@ -212,10 +212,10 @@ const T = '<td align="center" class="ins-product-td items-block items-block-v2">
   }
 } };
 function m(e, s = 8) {
-  return a(1, s + 1).map((i) => `${e}_${i}`);
+  return E(1, s + 1).map((i) => `${e}_${i}`);
 }
-function t() {
-  const { PAIRS_FOR_EXTENSION: e } = E, s = [];
+function r() {
+  const { PAIRS_FOR_EXTENSION: e } = a, s = [];
   return s.push(
     e.imageSrc.CART_ITEMS.ATTR,
     e.imageSrc.BROWSED_ITEMS.ATTR,
@@ -234,22 +234,34 @@ function t() {
   ), s.push(
     e.price.CART_ITEMS.PRICE,
     e.price.CART_ITEMS.PRICE_FORMATTED,
+    e.price.CART_ITEMS.SINGLE_PRICE,
+    e.price.CART_ITEMS.SINGLE_PRICE_FORMATTED,
     e.price.CART_ITEMS.CURRENCY,
     e.price.BROWSED_ITEMS.PRICE,
     e.price.BROWSED_ITEMS.PRICE_FORMATTED,
+    e.price.BROWSED_ITEMS.SINGLE_PRICE,
+    e.price.BROWSED_ITEMS.SINGLE_PRICE_FORMATTED,
     e.price.BROWSED_ITEMS.CURRENCY,
     e.price.PURCHASED_ITEMS.PRICE,
     e.price.PURCHASED_ITEMS.PRICE_FORMATTED,
+    e.price.PURCHASED_ITEMS.SINGLE_PRICE,
+    e.price.PURCHASED_ITEMS.SINGLE_PRICE_FORMATTED,
     e.price.PURCHASED_ITEMS.CURRENCY
   ), s.push(
     e.originalPrice.CART_ITEMS.PRICE,
     e.originalPrice.CART_ITEMS.PRICE_FORMATTED,
+    e.originalPrice.CART_ITEMS.SINGLE_PRICE,
+    e.originalPrice.CART_ITEMS.SINGLE_PRICE_FORMATTED,
     e.originalPrice.CART_ITEMS.CURRENCY,
     e.originalPrice.BROWSED_ITEMS.PRICE,
     e.originalPrice.BROWSED_ITEMS.PRICE_FORMATTED,
+    e.originalPrice.BROWSED_ITEMS.SINGLE_PRICE,
+    e.originalPrice.BROWSED_ITEMS.SINGLE_PRICE_FORMATTED,
     e.originalPrice.BROWSED_ITEMS.CURRENCY,
     e.originalPrice.PURCHASED_ITEMS.PRICE,
     e.originalPrice.PURCHASED_ITEMS.PRICE_FORMATTED,
+    e.originalPrice.PURCHASED_ITEMS.SINGLE_PRICE,
+    e.originalPrice.PURCHASED_ITEMS.SINGLE_PRICE_FORMATTED,
     e.originalPrice.PURCHASED_ITEMS.CURRENCY
   ), s.push(
     e.button.CART_ITEMS.HREF,
@@ -262,11 +274,11 @@ function t() {
   ), s;
 }
 const o = _(
-  t(),
+  r(),
   (e) => m(e)
 );
 export {
   o as itemsBlockDynamicVariables,
-  E as productPairs,
+  a as productPairs,
   T as templateFirstLine
 };

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.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.CUSTOM_ATTR_TEXT_TRIM = "recommendation-block-custom-attr-text-trim-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,21 +1,22 @@
-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 { 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 { RecommendationBlockId as l } from "../../constants/blockIds.js";
 import { RecommendationControlId as e } from "../../constants/controlIds.js";
-import { BLOCK_ROOT_SELECTOR as I, ATTR_PRODUCT_ATTR as s } from "../../constants/selectors.js";
+import { BLOCK_ROOT_SELECTOR as A, ATTR_PRODUCT_ATTR as s } from "../../constants/selectors.js";
+import { CustomAttributeTextTrimControl as I } from "./textTrim.js";
 function o(t) {
-  const n = t.closest(I);
-  if (!n)
+  const r = t.closest(A);
+  if (!r)
     return [];
-  const r = t.asElement().getAttribute(s);
-  if (r) {
-    const T = `[esd-extension-block-id="${l.CUSTOM_ATTRIBUTE}"][${s}="${r}"]`;
-    return n.querySelectorAll(T);
+  const n = t.asElement().getAttribute(s);
+  if (n) {
+    const T = `[esd-extension-block-id="${l.CUSTOM_ATTRIBUTE}"][${s}="${n}"]`;
+    return r.querySelectorAll(T);
   }
-  return n.querySelectorAll(
+  return r.querySelectorAll(
     `[esd-extension-block-id="${l.CUSTOM_ATTRIBUTE}"]`
   );
 }
-const A = class extends a {
+const m = class extends a {
   getId() {
     return e.CUSTOM_ATTR_ALIGN;
   }
@@ -36,7 +37,7 @@ const A = class extends a {
   getTargetNodes(t) {
     return o(t);
   }
-}, m = class extends i {
+}, x = class extends c {
   getId() {
     return e.CUSTOM_ATTR_STYLE;
   }
@@ -50,29 +51,31 @@ const A = class extends a {
   getTargetNodes(t) {
     return o(t);
   }
-}, R = class extends c {
+}, R = class extends i {
   getId() {
     return e.CUSTOM_ATTR_BACKGROUND;
   }
   getTargetNodes(t) {
     return o(t);
   }
-}, x = class extends d {
+}, B = class extends d {
   getId() {
     return e.CUSTOM_ATTR_PADDINGS;
   }
   getTargetNodes(t) {
     return o(t);
   }
-}, k = {
-  align: A,
+}, p = {
+  align: m,
   color: _,
   size: S,
-  style: m,
+  style: x,
   fontFamily: O,
   background: R,
-  paddings: x
+  paddings: B,
+  textTrim: I
 };
 export {
-  k as CustomAttributeControls
+  p as CustomAttributeControls,
+  I as CustomAttributeTextTrimControl
 };

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

@@ -0,0 +1,99 @@
+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/main/algorithm.js

@@ -1,7 +1,7 @@
-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";
+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";
 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._setFormValues();
+    super.onTemplateNodeUpdated(t), this._initializeSelectItems(), this._setFormValues();
   }
   _setFormValues() {
     const t = n.getConfig(this.currentNode);
@@ -58,7 +58,7 @@ class T extends d {
       try {
         this.api.setUIEAttribute(
           e.ALGORITHM,
-          l.SELECTPICKER.items,
+          h.SELECTPICKER.items,
           t
         );
       } catch (r) {

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

@@ -114,7 +114,9 @@ class H extends g {
     var r;
     super.onTemplateNodeUpdated(t);
     const e = this._getRecommendationIdFromNode(t);
-    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), [
+    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();
+    }), [
       this.layoutOrientationControl,
       this.productCountControl,
       this.algorithmControl,