@useinsider/guido 3.0.0-beta.7d3a300 → 3.0.0-beta.952fc1f

package/dist/config/i18n/en/tooltips.json.js

@@ -75,8 +75,7 @@ const e = {
   "The image with the invalid link cannot be saved to the image gallery": "Enter a valid image link to continue.",
   "The data source link is unavailable. Please, make sure there is an access to the data source.": "Enter an accessible Data Source Link to contiue.",
   "The file should not exceed the maximum resolution of {maxImageResolution}px.": "Upload files up to 1024x512 pixels to continue.",
-  "The option is disabled because was overridden in the Code editor": "The option is disabled because it was overridden in the Code Editor.",
-  "Dropdown with a list of available data services, preliminarily created in the Data section → Services tab of the Account.": "Service for Data Collection lets you enter a form submission URL for the recipients to submit."
+  "The option is disabled because was overridden in the Code editor": "The option is disabled because it was overridden in the Code Editor."
 };
 export {
   e as default

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

@@ -1,41 +1,45 @@
-var f = Object.defineProperty;
-var h = (r, o, t) => o in r ? f(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
-var g = (r, o, t) => h(r, typeof o != "symbol" ? o + "" : o, t);
-import { BlockId as I } from "../../../enums/block.js";
-import { getMigrationBannerHtml as k } from "../../../utils/migrationBannerHtml.js";
-import { Block as B, BlockCompositionType as _, ModificationDescription as R } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { ensureMobileCssRulesExist as d } from "./controls/mobileLayout/cssRules.js";
-import { RecommendationConfigService as s } from "./services/configService.js";
-import { useRecommendationExtensionStore as u } from "./store/recommendation.js";
-import { getDefaultTemplate as A } from "./templates/grid/template.js";
-const p = I.Recommendation, c = "recommendation-block-v2", a = "recommendation-id";
-class T extends B {
+var k = Object.defineProperty;
+var I = (r, n, t) => n in r ? k(r, n, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[n] = t;
+var u = (r, n, t) => I(r, typeof n != "symbol" ? n + "" : n, t);
+import { BlockId as B } from "../../../enums/block.js";
+import { getMigrationBannerHtml as _ } from "../../../utils/migrationBannerHtml.js";
+import { Block as b, BlockCompositionType as R, ModificationDescription as y } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { regenerateMobileProductRows as C } from "./controls/main/utils.js";
+import { ensureMobileCssRulesExist as g, setMobileLayoutOptOut as d, hasMobileLayoutOptOut as A } from "./controls/mobileLayout/cssRules.js";
+import { RecommendationConfigService as c } from "./services/configService.js";
+import { useRecommendationExtensionStore as p } from "./store/recommendation.js";
+import { getDefaultTemplate as E } from "./templates/grid/template.js";
+const f = B.Recommendation, a = "recommendation-block-v2", l = "recommendation-id";
+let h = !1;
+class q extends b {
   constructor() {
     super();
     /**
      * Stores the ID generated in getTemplate() so onCreated() can reuse it.
      * This avoids generating a new (different) ID in onCreated().
      */
-    g(this, "_pendingBlockId", null);
+    u(this, "_pendingBlockId", null);
   }
   getId() {
-    return p;
+    return f;
   }
   getIcon() {
     return "recommendation-icon";
   }
   getBlockCompositionType() {
-    return _.CONTAINER;
+    return R.CONTAINER;
   }
   getName() {
     return this.api.translate("Recommendation Block");
   }
   getDescription() {
-    return this.api.translate("Recommendation Block Title Description");
+    return this.api.translate(
+      "Recommendation lets you display personalized product recommendations to users based on their algorithm."
+    );
   }
   getSettingsPanelTitleHtml() {
-    return k(
-      p,
+    return _(
+      f,
       this.api.translate("Recommendation Block"),
       this.api.translate("This block is switched from the Old Version to the New Version. We recommend you check the Recommendation block and test your message to ensure it works properly.")
     );
@@ -52,7 +56,7 @@ class T extends B {
    */
   getTemplate() {
     const t = this._generateNextId();
-    return this._pendingBlockId = t, A(t);
+    return this._pendingBlockId = t, E(t);
   }
   /**
    * Called when a new block is dropped into the template
@@ -64,8 +68,13 @@ class T extends B {
   onCreated(t) {
     const e = this._pendingBlockId ?? this._generateNextId();
     this._pendingBlockId = null, this._assignRecommendationId(t, e);
-    const n = s.initializeConfig(this.api, t, { recommendationId: e }), i = u();
-    i.setCurrentBlock(e), d(this.api), i.patchCurrentBlockConfig({ language: n.language }, { triggerRefetch: !1 });
+    const o = c.initializeConfig(this.api, t, { recommendationId: e }), i = p();
+    i.setCurrentBlock(e), g(this.api);
+    const s = this._getBlockElement(t);
+    s && (d(this.api, s, !0), C({
+      currentNode: t,
+      documentModifier: this.api.getDocumentModifier()
+    })), i.patchCurrentBlockConfig({ language: o.language }, { triggerRefetch: !1 });
   }
   /**
    * Called when the document changes or template is loaded
@@ -78,14 +87,23 @@ class T extends B {
     if (!(!t || !("getNodeConfig" in t))) {
       if (!this._getRecommendationId(t)) {
         const e = this._generateNextId();
-        this._assignRecommendationId(t, e), s.hasConfig(t) && s.updateConfig(
+        this._assignRecommendationId(t, e), c.hasConfig(t) && c.updateConfig(
           this.api,
           t,
           { recommendationId: e },
           "Assign recommendation ID to legacy block"
         );
       }
-      s.needsMigration(t) && this._migrateFromLegacy(t), d(this.api);
+      c.needsMigration(t) && this._migrateFromLegacy(t);
+      try {
+        h || (g(this.api), h = !0);
+        const e = c.getConfig(t), o = this._getBlockElement(t);
+        if (o) {
+          const i = !e.mobileLayoutEnabled;
+          A(o) !== i && d(this.api, o, i);
+        }
+      } catch {
+      }
     }
   }
   /**
@@ -96,7 +114,7 @@ class T extends B {
    */
   onDelete(t) {
     const e = this._getRecommendationId(t);
-    e && u().removeBlockState(e);
+    e && p().removeBlockState(e);
   }
   /**
    * Generates the next unique recommendation ID by scanning all existing blocks
@@ -106,10 +124,10 @@ class T extends B {
     let t = 0;
     try {
       const e = this.api.getDocumentRoot();
-      e && "querySelectorAll" in e && e.querySelectorAll(`.${c}`).forEach((i) => {
+      e && "querySelectorAll" in e && e.querySelectorAll(`.${a}`).forEach((i) => {
         if ("getAttribute" in i) {
-          const m = i.getAttribute(a), l = m ? parseInt(m) : 0;
-          l > t && (t = l);
+          const s = i.getAttribute(l), m = s ? parseInt(s) : 0;
+          m > t && (t = m);
         }
       });
     } catch {
@@ -123,11 +141,11 @@ class T extends B {
    * added classes via setAttribute.
    */
   _assignRecommendationId(t, e) {
-    const n = this._getBlockElement(t);
-    if (!n)
+    const o = this._getBlockElement(t);
+    if (!o)
       return;
     const i = this.api.getDocumentModifier();
-    i.modifyHtml(n).setAttribute(a, e.toString()), i.apply(new R(`Assign recommendation ID ${e}`));
+    i.modifyHtml(o).setAttribute(l, e.toString()), i.apply(new y(`Assign recommendation ID ${e}`));
   }
   /**
    * Gets the recommendation-id from a block node
@@ -136,10 +154,10 @@ class T extends B {
     const e = this._getBlockElement(t);
     if (!e || !("getAttribute" in e))
       return null;
-    const n = e.getAttribute(a);
-    if (!n)
+    const o = e.getAttribute(l);
+    if (!o)
       return null;
-    const i = parseInt(n);
+    const i = parseInt(o);
     return Number.isNaN(i) ? null : i;
   }
   /**
@@ -148,19 +166,19 @@ class T extends B {
   _getBlockElement(t) {
     if ("getAttribute" in t) {
       const e = t.getAttribute("class");
-      if (e && e.includes(c))
+      if (e && e.includes(a))
         return t;
     }
-    return "querySelector" in t ? t.querySelector(`.${c}`) ?? null : null;
+    return "querySelector" in t ? t.querySelector(`.${a}`) : null;
   }
   /**
    * Migrate configuration from legacy format
    */
   _migrateFromLegacy(t) {
-    s.migrateFromDataAttributes(this.api, t);
+    c.migrateFromDataAttributes(this.api, t);
   }
 }
 export {
-  p as BLOCK_ID,
-  T as RecommendationBlock
+  f as BLOCK_ID,
+  q as RecommendationBlock
 };

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))(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/constants/defaultConfig.js

@@ -1,69 +1,71 @@
-import { DEFAULT_MOBILE_ROW_SPACING as U, DEFAULT_MOBILE_COLUMN_SPACING as R, DEFAULT_ROW_SPACING as n, DEFAULT_COLUMN_SPACING as O, DEFAULT_MOBILE_CARDS_IN_ROW as C, DEFAULT_CARDS_IN_ROW as D } from "./layout.js";
-import { ATTR_PRODUCT_IMAGE as _, ATTR_PRODUCT_NAME as o, ATTR_PRODUCT_OLD_PRICE as t, ATTR_PRODUCT_PRICE as e, ATTR_PRODUCT_OMNIBUS_PRICE as T, ATTR_PRODUCT_OMNIBUS_DISCOUNT as I, ATTR_PRODUCT_BUTTON as r } from "./selectors.js";
-const i = {
+import { DEFAULT_MOBILE_ROW_SPACING as R, DEFAULT_MOBILE_COLUMN_SPACING as U, DEFAULT_ROW_SPACING as i, DEFAULT_COLUMN_SPACING as s, DEFAULT_MOBILE_CARDS_IN_ROW as o, DEFAULT_CARDS_IN_ROW as C } from "./layout.js";
+import { ATTR_PRODUCT_IMAGE as _, ATTR_PRODUCT_NAME as e, ATTR_PRODUCT_OLD_PRICE as t, ATTR_PRODUCT_PRICE as T, ATTR_PRODUCT_OMNIBUS_PRICE as r, ATTR_PRODUCT_OMNIBUS_DISCOUNT as I, ATTR_PRODUCT_BUTTON as n } from "./selectors.js";
+const O = {
   code: "USD",
   symbol: "USD",
   alignment: "after",
   decimalCount: 2,
   decimalSeparator: ".",
   thousandSeparator: ","
-}, A = {
+}, D = {
   textBefore: "",
   textAfter: ""
-}, s = {
+}, A = {
   textBefore: "",
   textAfter: ""
-}, E = [
+}, a = [
   _,
-  o,
-  t,
   e,
+  t,
   T,
+  r,
   I,
-  r
-], c = {
+  n
+], E = {
   [_]: !0,
-  [o]: !0,
   [e]: !0,
+  [T]: !0,
   [t]: !0,
-  [T]: !1,
+  [r]: !1,
   [I]: !1,
-  [r]: !0
-}, N = {
+  [n]: !0
+}, l = {
   // Settings
   strategy: "mostPopular",
   productIds: [],
   size: "6",
   shuffleProducts: !1,
   language: "en_US",
-  currency: i,
+  currency: O,
   filters: [],
   // Layout
   layout: "grid",
-  cardsInRow: D,
-  mobileCardsInRow: C,
-  columnSpacing: O,
-  rowSpacing: n,
-  mobileColumnSpacing: R,
-  mobileRowSpacing: U,
+  cardsInRow: C,
+  mobileCardsInRow: o,
+  mobileLayoutEnabled: !1,
+  previousMobileCardsInRow: o,
+  columnSpacing: s,
+  rowSpacing: i,
+  mobileColumnSpacing: U,
+  mobileRowSpacing: R,
   // Composition
-  composition: E,
-  visibility: c,
+  composition: a,
+  visibility: E,
   // Element settings
-  omnibusPrice: A,
-  omnibusDiscount: s,
+  omnibusPrice: D,
+  omnibusDiscount: A,
   textTrimming: !1,
   // Meta
   configVersion: 1,
   recommendationId: 0
-}, m = [11, 12], L = 1;
+}, N = [11, 12], m = 1;
 export {
-  L as CURRENT_CONFIG_VERSION,
-  E as DEFAULT_COMPOSITION,
-  i as DEFAULT_CURRENCY,
-  N as DEFAULT_NODE_CONFIG,
-  s as DEFAULT_OMNIBUS_DISCOUNT,
-  A as DEFAULT_OMNIBUS_PRICE,
-  c as DEFAULT_VISIBILITY,
-  m as EXCLUDED_ALGORITHM_IDS
+  m as CURRENT_CONFIG_VERSION,
+  a as DEFAULT_COMPOSITION,
+  O as DEFAULT_CURRENCY,
+  l as DEFAULT_NODE_CONFIG,
+  A as DEFAULT_OMNIBUS_DISCOUNT,
+  D as DEFAULT_OMNIBUS_PRICE,
+  E as DEFAULT_VISIBILITY,
+  N as EXCLUDED_ALGORITHM_IDS
 };

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

@@ -1,7 +1,7 @@
 import { ModificationDescription as d } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { CommonControl as s } from "../../../common-control.js";
 import { getCurrentLayout as l } from "../main/utils.js";
-const u = "recommendation-card-background-color-control", e = {
+const i = "recommendation-card-background-color-control", e = {
   CARD_BACKGROUND_COLOR: "cardBackgroundColor"
 }, a = {
   GRID: ".product-card-segment",
@@ -9,13 +9,13 @@ const u = "recommendation-card-background-color-control", e = {
 };
 class _ extends s {
   getId() {
-    return u;
+    return i;
   }
   getTemplate() {
     return `
             <div class="card-bg-control-container">
                 ${this._GuTwoColumns([
-      this._GuLabel({ text: "Card Background Color" }),
+      this._GuLabel({ text: this.api.translate("Card Background Color") }),
       this._GuColorPicker(e.CARD_BACKGROUND_COLOR)
     ])}
             </div>
@@ -75,6 +75,6 @@ class _ extends s {
   }
 }
 export {
-  u as CARD_BACKGROUND_COLOR_CONTROL_ID,
+  i as CARD_BACKGROUND_COLOR_CONTROL_ID,
   _ as CardBackgroundColorControl
 };

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

@@ -1,15 +1,15 @@
 var c = Object.defineProperty;
-var d = (r, i, t) => i in r ? c(r, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[i] = t;
-var a = (r, i, t) => d(r, typeof i != "symbol" ? i + "" : i, t);
-import { UEAttr as h } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { CommonControl as l } from "../../../common-control.js";
+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";
 const g = "recommendation-algorithm-control", e = {
   ALGORITHM: "strategy",
   PRODUCT_IDS: "productIds"
 };
-class T extends l {
+class T extends d {
   constructor() {
     super(...arguments);
     // Store is used ONLY for API-fetched data (algorithms list), not for config
@@ -22,16 +22,16 @@ class T extends l {
     return `
             <div class="algorithm-control-container">
                 ${this._GuTwoColumns([
-      this._GuLabel({ text: "Recommendation Algorithm" }),
+      this._GuLabel({ text: this.api.translate("Recommendation Algorithm") }),
       this._GuSelect({
         name: e.ALGORITHM,
-        placeholder: "Select Recommendation Algorithm",
+        placeholder: this.api.translate("Select Recommendation Algorithm"),
         options: this.store.getActivePredictiveAlgorithms
       }),
-      this._GuLabel({ text: "Product Ids", name: `${e.PRODUCT_IDS}_label` }),
+      this._GuLabel({ text: this.api.translate("Product Ids"), name: `${e.PRODUCT_IDS}_label` }),
       this._GuTextInput({
         name: e.PRODUCT_IDS,
-        placeholder: "Enter Product Ids",
+        placeholder: this.api.translate("Enter Product Ids"),
         className: "es-180w"
       })
     ])}
@@ -58,16 +58,16 @@ class T extends l {
       try {
         this.api.setUIEAttribute(
           e.ALGORITHM,
-          h.SELECTPICKER.items,
+          l.SELECTPICKER.items,
           t
         );
-      } catch (s) {
-        console.warn("[AlgorithmControl] Failed to set algorithm options:", s);
+      } catch (r) {
+        console.warn("[AlgorithmControl] Failed to set algorithm options:", r);
       }
   }
   _setProductIdsVisibility(t) {
-    const s = (t ?? n.getConfig(this.currentNode).strategy) === "manualMerchandising";
-    this.api.setVisibility(e.PRODUCT_IDS, s), this.api.setVisibility(`${e.PRODUCT_IDS}_label`, s);
+    const r = (t ?? n.getConfig(this.currentNode).strategy) === "manualMerchandising";
+    this.api.setVisibility(e.PRODUCT_IDS, r), this.api.setVisibility(`${e.PRODUCT_IDS}_label`, r);
   }
   _onAlgorithmChange(t) {
     !this.currentNode || n.getConfig(this.currentNode).strategy === t || (n.updateConfig(
@@ -80,7 +80,7 @@ class T extends l {
   _onProductIdsChange(t) {
     if (!this.currentNode)
       return;
-    const o = t.split(",").map((s) => s.trim()).filter(Boolean);
+    const o = t.split(",").map((r) => r.trim()).filter(Boolean);
     n.updateConfig(
       this.api,
       this.currentNode,

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

@@ -1,9 +1,9 @@
-var R = Object.defineProperty;
-var _ = (i, o, e) => o in i ? R(i, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : i[o] = e;
-var c = (i, o, e) => _(i, typeof o != "symbol" ? o + "" : o, e);
-import { currencyLocationMaps as l, currencyOperators as a, currencyDecimalCounts as h } from "../../../../../enums/extensions/recommendationBlock.js";
-import { UEAttr as m } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { CommonControl as p } from "../../../common-control.js";
+var p = Object.defineProperty;
+var R = (o, a, e) => a in o ? p(o, a, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[a] = e;
+var c = (o, a, e) => R(o, typeof a != "symbol" ? a + "" : a, e);
+import { currencyLocationMaps as l, currencyOperators as i, currencyDecimalCounts as h } from "../../../../../enums/extensions/recommendationBlock.js";
+import { UEAttr as _ } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { CommonControl as m } from "../../../common-control.js";
 import { RecommendationConfigService as s } from "../../services/configService.js";
 import { useRecommendationExtensionStore as d } from "../../store/recommendation.js";
 import { setCurrencyAttributes as S, updatePricesInPlace as N } from "./utils.js";
@@ -15,7 +15,7 @@ const E = "recommendation-currency-control", t = {
   CURRENCY_DECIMAL_SEPARATOR: "currencyDecimalSeparator",
   CURRENCY_DECIMAL_COUNT: "currencyDecimalCount"
 };
-class Y extends p {
+class Y extends m {
   constructor() {
     super(...arguments);
     // Store is used ONLY for API-fetched data (currency list), not for config
@@ -30,40 +30,40 @@ class Y extends p {
     return `
             <div class="currency-control-container">
                 ${this._GuTwoColumns([
-      this._GuLabel({ text: "Currency" }),
+      this._GuLabel({ text: this.api.translate("Currency") }),
       this._GuSelect({
         name: t.CURRENCY,
-        placeholder: "Select Currency",
+        placeholder: this.api.translate("Select Currency"),
         options: this.store.currencyList
       }),
-      this._GuLabel({ text: "Currency Location" }),
+      this._GuLabel({ text: this.api.translate("Currency Location") }),
       this._GuSelect({
         name: t.CURRENCY_LOCATION,
-        placeholder: "Select Currency Location",
+        placeholder: this.api.translate("Select Currency Location"),
         options: l
       }),
-      this._GuLabel({ text: "Currency Symbol" }),
+      this._GuLabel({ text: this.api.translate("Currency Symbol") }),
       this._GuTextInput({
         name: t.CURRENCY_SYMBOL,
-        placeholder: "Enter Currency Symbol",
+        placeholder: this.api.translate("Enter Currency Symbol"),
         className: "es-180w"
       }),
-      this._GuLabel({ text: "Thousand Separator" }),
+      this._GuLabel({ text: this.api.translate("Thousand Separator") }),
       this._GuSelect({
         name: t.CURRENCY_THOUSAND_SEPARATOR,
-        placeholder: "Select Thousand Separator",
-        options: a
+        placeholder: this.api.translate("Select Thousand Separator"),
+        options: i
       }),
-      this._GuLabel({ text: "Decimal Separator" }),
+      this._GuLabel({ text: this.api.translate("Decimal Separator") }),
       this._GuSelect({
         name: t.CURRENCY_DECIMAL_SEPARATOR,
-        placeholder: "Select Decimal Separator",
-        options: a
+        placeholder: this.api.translate("Select Decimal Separator"),
+        options: i
       }),
-      this._GuLabel({ text: "Decimal Count" }),
+      this._GuLabel({ text: this.api.translate("Decimal Count") }),
       this._GuSelect({
         name: t.CURRENCY_DECIMAL_COUNT,
-        placeholder: "Select Decimal Count",
+        placeholder: this.api.translate("Select Decimal Count"),
         options: h
       })
     ])}
@@ -96,12 +96,12 @@ class Y extends p {
     const { store: e } = this, r = {
       [t.CURRENCY]: e.currencyList,
       [t.CURRENCY_LOCATION]: l,
-      [t.CURRENCY_THOUSAND_SEPARATOR]: a,
-      [t.CURRENCY_DECIMAL_SEPARATOR]: a,
+      [t.CURRENCY_THOUSAND_SEPARATOR]: i,
+      [t.CURRENCY_DECIMAL_SEPARATOR]: i,
       [t.CURRENCY_DECIMAL_COUNT]: h
     };
     Object.entries(r).forEach(([C, n]) => {
-      this.api.setUIEAttribute(C, m.SELECTPICKER.items, n);
+      this.api.setUIEAttribute(C, _.SELECTPICKER.items, n);
     });
   }
   /**

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

@@ -21,10 +21,10 @@ class h extends s {
     return `
             <div class="filters-control-container">
                 ${this._GuTwoColumns([
-      this._GuLabel({ text: "Filters" }),
+      this._GuLabel({ text: this.api.translate("Filters") }),
       this._GuButton({
         name: a.FILTERS,
-        label: "Add Filter",
+        label: this.api.translate("Add Filter"),
         id: "guido__btn-add-filter"
       })
     ])}