@useinsider/guido 3.2.0-beta.35a8cdd → 3.2.0-beta.49fb630

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

@@ -1,10 +1,11 @@
 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 p(e, u, r, o, s, n) {
+function m(e, u, r, o, s, n) {
   switch (u) {
     case "productImage": {
       const t = e.querySelector("img");
@@ -69,67 +70,69 @@ function p(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"), i = t.querySelector("p");
-        if (i) {
-          const a = i.querySelector("strong") || i;
-          a.textContent = `{{${n}${r}_${o}_${c}}}`;
+        const c = t.getAttribute("product-attr"), a = t.querySelector("p");
+        if (a) {
+          const i = a.querySelector("strong") || a;
+          i.textContent = `{{${n}${r}_${o}_${c}}}`;
         }
       }
       break;
     }
   }
 }
-function d(e, u, r, o) {
+function q(e, u, r, o) {
   e.querySelectorAll(".recommendation-product-row").forEach((n, t) => {
-    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);
+    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);
     });
   });
 }
-function q(e, u, r, o) {
+function g(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((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);
+  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);
       });
     });
   });
 }
-function g(e, u, r, o) {
+function h(e, u, r, o) {
   e.querySelectorAll(".ins-recommendation-product-container").forEach((n) => {
-    q(n, u, r, o);
+    g(n, u, r, o);
   });
 }
-function h(e, u, r) {
+function C(e, u, r) {
   const o = e.getAttribute("data-layout") || "grid", s = e.getAttribute("currency-alignment") || "after";
-  o === "list" ? d(e, u, s, r) : g(e, u, s, r);
+  o === "list" ? q(e, u, s, r) : h(e, u, s, r);
 }
-function C(e, u) {
+function E(e, u) {
   const r = e.match(/<!DOCTYPE[^>]*>/i);
   return (r ? `${r[0]}
 ` : "") + u.documentElement.outerHTML;
 }
-function P(e) {
+function T(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 } = _(), { isFeatureEnabled: n } = S(), t = n("liquidSyntax") ? "reco_" : "";
+  const { buildCampaignUrl: s } = _(), n = d();
+  n.recommendationCampaignUrls = {};
+  const { isFeatureEnabled: t } = S(), c = t("liquidSyntax") ? "reco_" : "";
   return o.forEach((i) => {
-    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;", "%}");
+    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;", "%}");
 }
 export {
   y as formatPriceVariable,
-  P as prepareRecommendationBlocks
+  T as prepareRecommendationBlocks
 };

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/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,

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

@@ -1,14 +1,15 @@
-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 = {
+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 = {
   TEXT_TRIM_ENABLED: "textTrimEnabled"
-}, 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 {
+};
+class N extends u {
   getId() {
-    return m.NAME_TEXT_TRIM;
+    return d.NAME_TEXT_TRIM;
   }
   getTemplate() {
     return `
@@ -16,7 +17,7 @@ class N extends d {
             <div class="name-text-trim-control-container">
                 ${this._GuTwoColumns([
       this._GuLabel({ text: this.api.translate("Trim Long Text") }),
-      this._GuToggle(i.TEXT_TRIM_ENABLED)
+      this._GuToggle(s.TEXT_TRIM_ENABLED)
     ])}
             </div>
         `;
@@ -30,76 +31,45 @@ class N extends d {
   _setFormValues() {
     const e = this._getCurrentTrimState();
     this.api.updateValues({
-      [i.TEXT_TRIM_ENABLED]: e
+      [s.TEXT_TRIM_ENABLED]: e
     });
   }
   _getCurrentTrimState() {
     if (!this.currentNode || !("hasClass" in this.currentNode))
       return !1;
-    if (this.currentNode.hasClass(o))
+    if (this.currentNode.hasClass(r))
       return !0;
-    const e = this.currentNode.closest(u);
+    const e = this.currentNode.closest(m);
     if (!e)
       return !1;
     const t = e.querySelector(
-      `[esd-extension-block-id="${l.NAME}"]`
+      `[esd-extension-block-id="${a.NAME}"]`
     );
-    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"));
+    return t && "hasClass" in t ? t.hasClass(r) : !1;
   }
   _onTextTrimChange(e) {
     if (!this.currentNode || !("closest" in this.currentNode))
       return;
-    const t = this.currentNode.closest(u);
+    const t = this.currentNode.closest(m);
     if (!t || !("querySelectorAll" in t))
       return;
-    const s = Array.from(
-      t.querySelectorAll(`[esd-extension-block-id="${l.NAME}"]`)
+    const i = Array.from(
+      t.querySelectorAll(`[esd-extension-block-id="${a.NAME}"]`)
     );
-    if (!s.length)
+    if (!i.length)
       return;
-    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 && 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 ? "Enable product name text trimming" : "Disable product name text trimming"
       )
     );
   }
   _listenToFormUpdates() {
-    this.api.onValueChanged(i.TEXT_TRIM_ENABLED, (e) => {
+    this.api.onValueChanged(s.TEXT_TRIM_ENABLED, (e) => {
       this._onTextTrimChange(e);
     });
   }

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

@@ -0,0 +1,14 @@
+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/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 N } from "./constants/blockIds.js";
+import { RecommendationBlockId as S } 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 S } from "./controls/syncInfoMessage.js";
+import { SYNC_INFO_MESSAGE_CONTROL_ID as N } 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[N.NAME] = [
+    ], I[S.NAME] = [
       new _(
         O.SETTINGS,
         [
-          S,
+          N,
           T.NAME_STYLE,
           T.NAME_ALIGN,
           T.NAME_TEXT_TRIM,
@@ -59,11 +59,11 @@ class Z extends E {
           T.NAME_COLOR
         ]
       )
-    ], I[N.PRICE] = [
+    ], I[S.PRICE] = [
       new _(
         O.SETTINGS,
         [
-          S,
+          N,
           T.PRICE_STYLE,
           T.PRICE_ALIGN,
           T.PRICE_PADDINGS
@@ -78,11 +78,11 @@ class Z extends E {
           T.PRICE_COLOR
         ]
       )
-    ], I[N.OLD_PRICE] = [
+    ], I[S.OLD_PRICE] = [
       new _(
         O.SETTINGS,
         [
-          S,
+          N,
           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[N.OMNIBUS_PRICE] = [
+    ], I[S.OMNIBUS_PRICE] = [
       new _(
         O.SETTINGS,
         [
-          S,
+          N,
           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[N.OMNIBUS_DISCOUNT] = [
+    ], I[S.OMNIBUS_DISCOUNT] = [
       new _(
         O.SETTINGS,
         [
-          S,
+          N,
           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[N.BUTTON] = [
+    ], I[S.BUTTON] = [
       new _(
         O.SETTINGS,
         [
-          S,
+          N,
           T.BUTTON_TEXT,
           T.BUTTON_ALIGN,
           T.BUTTON_PADDINGS,
@@ -162,12 +162,13 @@ class Z extends E {
           T.BUTTON_BORDER
         ]
       )
-    ], I[N.CUSTOM_ATTRIBUTE] = [
+    ], I[S.CUSTOM_ATTRIBUTE] = [
       new _(
         O.SETTINGS,
         [
           T.CUSTOM_ATTR_STYLE,
           T.CUSTOM_ATTR_ALIGN,
+          T.CUSTOM_ATTR_TEXT_TRIM,
           T.CUSTOM_ATTR_PADDINGS
         ]
       ),
@@ -180,11 +181,11 @@ class Z extends E {
           T.CUSTOM_ATTR_COLOR
         ]
       )
-    ], I[N.IMAGE] = [
+    ], I[S.IMAGE] = [
       new _(
         O.SETTINGS,
         [
-          S,
+          N,
           T.IMAGE_SIZE,
           T.IMAGE_MARGINS
         ]