@useinsider/guido 2.1.0-beta.04bd1f4 → 2.1.0-beta.071f320

package/dist/config/migrator/recommendationMigrator.js

@@ -1,26 +1,24 @@
 var h = Object.defineProperty;
-var T = (d, e, t) => e in d ? h(d, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[e] = t;
-var A = (d, e, t) => T(d, typeof e != "symbol" ? e + "" : e, t);
-import { BLOCK_ID as S } from "../../extensions/Blocks/Recommendation/block.js";
-import P, { prepareProductRows as q } from "../../extensions/Blocks/Recommendation/templates/grid/migration.js";
-import { useTemplateStore as w } from "../../stores/template.js";
-import { getDefaultProducts as B } from "../../extensions/Blocks/Recommendation/templates/utils.js";
-class $ {
+var T = (A, e, t) => e in A ? h(A, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : A[e] = t;
+var m = (A, e, t) => T(A, typeof e != "symbol" ? e + "" : e, t);
+import P, { prepareProductRows as S } from "../../extensions/Blocks/Recommendation/templates/grid/migration.js";
+import { getDefaultProducts as q } from "../../extensions/Blocks/Recommendation/templates/utils.js";
+class w {
   constructor() {
-    A(this, "parser");
+    m(this, "parser");
     this.parser = new DOMParser();
   }
   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"]'
-      ), o = w();
-      return o.migrations[S] = s.length, s.length === 0 ? e : (s.forEach((n) => {
-        const r = n.getAttribute("id"), i = this.extractBgColor(n), u = this.extractTitle(n), c = this.extractProductRows(n), l = P.replace("{-{-TITLE-}-}", u).replace("{-{-PRODUCT_ROWS-}-}", c), a = this.parser.parseFromString(
-          `<table id="tempDoc"><tbody><tr>${l}</tr></tbody></table>`,
+      );
+      return s.length === 0 ? e : (s.forEach((o) => {
+        const l = o.getAttribute("id"), r = this.extractBgColor(o), i = this.extractTitle(o), u = this.extractProductRows(o), c = P.replace("{-{-TITLE-}-}", i).replace("{-{-PRODUCT_ROWS-}-}", u), a = this.parser.parseFromString(
+          `<table id="tempDoc"><tbody><tr>${c}</tr></tbody></table>`,
           "text/html"
         ).querySelector(".ins-recommendation-v3-block-v2");
-        a && n.parentNode && (r && a.setAttribute("id", r), i && a.setAttribute("bgcolor", i), n.parentNode.replaceChild(a, n));
+        a && o.parentNode && (l && a.setAttribute("id", l), r && a.setAttribute("bgcolor", r), o.parentNode.replaceChild(a, o));
       }), t.documentElement.outerHTML);
     } catch (t) {
       return console.error("RecommendationMigrator failed:", t), e;
@@ -66,7 +64,7 @@ class $ {
    * @returns HTML string for the title block
    */
   extractTitle(e) {
-    var g, a;
+    var a, g;
     const t = e.querySelector(".ext-recommendation-title");
     if (!t)
       return this.buildTitleBlock({
@@ -78,7 +76,7 @@ class $ {
       });
     const s = t.querySelector("p");
     if (!s) {
-      const p = ((g = t.textContent) == null ? void 0 : g.trim()) || "You May Also Like!", b = t.getAttribute("align") || "center";
+      const p = ((a = t.textContent) == null ? void 0 : a.trim()) || "You May Also Like!", b = t.getAttribute("align") || "center";
       return this.buildTitleBlock({
         text: p,
         isBold: !0,
@@ -87,13 +85,13 @@ class $ {
         styles: "font-size: 28px; color: #333333;"
       });
     }
-    const o = ((a = s.textContent) == null ? void 0 : a.trim()) || "You May Also Like!", n = t.getAttribute("align") || s.getAttribute("align") || "center", r = s.getAttribute("style") || "", i = /font-weight\s*:\s*bold/i.test(r) || !!s.querySelector("b, strong"), u = /font-style\s*:\s*italic/i.test(r) || !!s.querySelector("i, em"), c = this.removeStyleProperties(r, ["font-weight", "font-style"]), l = this.convertInlineToBlock(c);
+    const o = ((g = s.textContent) == null ? void 0 : g.trim()) || "You May Also Like!", l = t.getAttribute("align") || s.getAttribute("align") || "center", r = s.getAttribute("style") || "", i = /font-weight\s*:\s*bold/i.test(r) || !!s.querySelector("b, strong"), u = /font-style\s*:\s*italic/i.test(r) || !!s.querySelector("i, em"), c = this.removeStyleProperties(r, ["font-weight", "font-style"]), n = this.convertInlineToBlock(c);
     return this.buildTitleBlock({
       text: o,
       isBold: i,
       isItalic: u,
-      align: n,
-      styles: l
+      align: l,
+      styles: n
     });
   }
   /**
@@ -105,8 +103,8 @@ class $ {
     const t = this.extractProductConfig(e);
     if (!t)
       return console.warn("[RecommendationMigrator] No product config found, using defaults"), this.generateProductRows(6, 3, {});
-    const { totalCount: s, productsPerRow: o } = t, n = this.extractProductStyles(e);
-    return this.generateProductRows(s, o, n);
+    const { totalCount: s, productsPerRow: o } = t, l = this.extractProductStyles(e);
+    return this.generateProductRows(s, o, l);
   }
   /**
    * Extracts Stripo padding/margin utility classes from a class string
@@ -154,12 +152,12 @@ class $ {
    * @returns HTML string for product rows with applied styles
    */
   generateProductRows(e, t, s) {
-    const o = B(), n = [];
+    const o = q(), l = [];
     for (let i = 0; i < e; i++) {
       const u = o[i % o.length];
-      n.push({ ...u });
+      l.push({ ...u });
     }
-    let r = q(n, t);
+    let r = S(l, t);
     return r = this.applyExtractedStyles(r, s), r;
   }
   /**
@@ -173,30 +171,30 @@ class $ {
       return console.warn("[RecommendationMigrator] No product card found, using default styles"), t;
     const o = this.extractCardBgColor(s);
     o && (t.cardBgColor = o);
-    const n = s.querySelector(".ext-product-image");
-    if (n) {
-      const l = n.querySelector("img"), g = l == null ? void 0 : l.getAttribute("width"), a = n.getAttribute("style") || "", p = n.getAttribute("align") || "center", b = n.getAttribute("class") || "", m = this.extractStripoClasses(b);
-      t.imageWidth = g || "120", t.imageAlign = p, t.imageTdStyle = a, t.imageClasses = m;
+    const l = s.querySelector(".ext-product-image");
+    if (l) {
+      const n = l.querySelector("img"), a = n == null ? void 0 : n.getAttribute("width"), g = l.getAttribute("style") || "", p = l.getAttribute("align") || "center", b = l.getAttribute("class") || "", d = this.extractStripoClasses(b);
+      t.imageWidth = a || "120", t.imageAlign = p, t.imageTdStyle = g, t.imageClasses = d;
     }
     const r = s.querySelector(".ext-product-name");
     if (r) {
-      const l = r.querySelector("p"), g = (l == null ? void 0 : l.getAttribute("style")) || "", a = r.getAttribute("align") || "center", p = r.getAttribute("style") || "", b = r.getAttribute("class") || "", m = this.extractStripoClasses(b);
-      t.nameStyle = g, t.nameAlign = a, t.nameTdStyle = p, t.nameClasses = m;
+      const n = r.querySelector("p"), a = (n == null ? void 0 : n.getAttribute("style")) || "", g = r.getAttribute("align") || "center", p = r.getAttribute("style") || "", b = r.getAttribute("class") || "", d = this.extractStripoClasses(b);
+      t.nameStyle = a, t.nameAlign = g, t.nameTdStyle = p, t.nameClasses = d;
     }
     const i = s.querySelector(".ext-product-price");
     if (i) {
-      const l = i.querySelector("p"), g = (l == null ? void 0 : l.getAttribute("style")) || "", a = i.getAttribute("align") || "center", p = i.getAttribute("style") || "", b = i.getAttribute("class") || "", m = this.extractStripoClasses(b);
-      t.priceStyle = g, t.priceAlign = a, t.priceTdStyle = p, t.priceClasses = m;
+      const n = i.querySelector("p"), a = (n == null ? void 0 : n.getAttribute("style")) || "", g = i.getAttribute("align") || "center", p = i.getAttribute("style") || "", b = i.getAttribute("class") || "", d = this.extractStripoClasses(b);
+      t.priceStyle = a, t.priceAlign = g, t.priceTdStyle = p, t.priceClasses = d;
     }
     const u = s.querySelector(".ext-product-original-price");
     if (u) {
-      const l = u.querySelector("p"), g = (l == null ? void 0 : l.getAttribute("style")) || "", a = u.getAttribute("align") || "center", p = u.getAttribute("style") || "", b = u.getAttribute("class") || "", m = this.extractStripoClasses(b);
-      t.oldPriceStyle = g, t.oldPriceAlign = a, t.oldPriceTdStyle = p, t.oldPriceClasses = m;
+      const n = u.querySelector("p"), a = (n == null ? void 0 : n.getAttribute("style")) || "", g = u.getAttribute("align") || "center", p = u.getAttribute("style") || "", b = u.getAttribute("class") || "", d = this.extractStripoClasses(b);
+      t.oldPriceStyle = a, t.oldPriceAlign = g, t.oldPriceTdStyle = p, t.oldPriceClasses = d;
     }
     const c = s.querySelector(".ext-product-button");
     if (c) {
-      const l = c.querySelector(".es-button-border"), g = c.querySelector("a.es-button"), a = (l == null ? void 0 : l.getAttribute("style")) || "", p = (g == null ? void 0 : g.getAttribute("style")) || "", b = c.getAttribute("align") || "center", m = c.getAttribute("style") || "", f = c.getAttribute("class") || "", C = this.extractStripoClasses(f), y = ((c == null ? void 0 : c.textContent) || "").trim();
-      t.buttonBorderStyle = a, t.buttonLinkStyle = p, t.buttonAlign = b, t.buttonTdStyle = m, t.buttonClasses = C, t.buttonText = y;
+      const n = c.querySelector(".es-button-border"), a = c.querySelector("a.es-button"), g = (n == null ? void 0 : n.getAttribute("style")) || "", p = (a == null ? void 0 : a.getAttribute("style")) || "", b = c.getAttribute("align") || "center", d = c.getAttribute("style") || "", f = c.getAttribute("class") || "", C = this.extractStripoClasses(f), y = ((c == null ? void 0 : c.textContent) || "").trim();
+      t.buttonBorderStyle = g, t.buttonLinkStyle = p, t.buttonAlign = b, t.buttonTdStyle = d, t.buttonClasses = C, t.buttonText = y;
     }
     return t;
   }
@@ -242,8 +240,8 @@ class $ {
       i && t.oldPriceStyle && i.setAttribute("style", t.oldPriceStyle);
     }), (t.buttonBorderStyle || t.buttonLinkStyle || t.buttonAlign || t.buttonTdStyle || t.buttonClasses) && s.querySelectorAll(".product-button").forEach((r) => {
       if (t.buttonAlign && r.setAttribute("align", t.buttonAlign), t.buttonTdStyle && r.setAttribute("style", t.buttonTdStyle), t.buttonClasses) {
-        const l = `${r.getAttribute("class") || ""} ${t.buttonClasses}`.trim();
-        r.setAttribute("class", l);
+        const n = `${r.getAttribute("class") || ""} ${t.buttonClasses}`.trim();
+        r.setAttribute("class", n);
       }
       const i = r.querySelector(".es-button-border");
       i && t.buttonBorderStyle && i.setAttribute("style", t.buttonBorderStyle);
@@ -272,8 +270,8 @@ class $ {
    * Removes specified style properties from a style string
    */
   removeStyleProperties(e, t) {
-    return e ? t.reduce((o, n) => {
-      const r = new RegExp(`${n}\\s*:\\s*[^;]*;?`, "gi");
+    return e ? t.reduce((o, l) => {
+      const r = new RegExp(`${l}\\s*:\\s*[^;]*;?`, "gi");
       return o.replace(r, "");
     }, e).replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim() : "";
   }
@@ -287,9 +285,9 @@ class $ {
     return /display\s*:/i.test(t) || (t = t ? `${t}; display: block` : "display: block"), t.replace(/;\s*;/g, ";").replace(/^;|;$/g, "").replace(/"/g, "'").trim();
   }
 }
-function v(d) {
-  return new $().migrate(d);
+function k(A) {
+  return new w().migrate(A);
 }
 export {
-  v as migrateRecommendation
+  k as migrateRecommendation
 };

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

@@ -1,19 +1,18 @@
-import { useOnboardingStore as g } from "../../../stores/onboarding.js";
-import { useTemplateStore as f } from "../../../stores/template.js";
-import { Block as u, BlockCompositionType as I, UIElementType as c, UEAttr as C, ModificationDescription as r } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { SETTINGS_ENUMS as l, DefaultConfigValues as s } from "./enums/settingsEnums.js";
-import { getDefaultTemplate as y } from "./template.js";
-import { getItemsBlockContainer as b, getItemsBlockConfig as k, getDefaultItemsBlockConfig as N } from "./utils/nodeConfigUtils.js";
-const m = "items-block";
-class M extends u {
+import { useOnboardingStore as d } from "../../../stores/onboarding.js";
+import { Block as g, BlockCompositionType as f, ModificationDescription as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { SETTINGS_ENUMS as c, DefaultConfigValues as i } from "./enums/settingsEnums.js";
+import { getDefaultTemplate as p } from "./template.js";
+import { getItemsBlockContainer as u, getItemsBlockConfig as C, getDefaultItemsBlockConfig as I } from "./utils/nodeConfigUtils.js";
+const y = "items-block";
+class B extends g {
   getId() {
-    return m;
+    return y;
   }
   getIcon() {
     return "items-icon";
   }
   getBlockCompositionType() {
-    return I.CONTAINER;
+    return f.CONTAINER;
   }
   getName() {
     return this.api.translate("Items");
@@ -21,54 +20,35 @@ class M extends u {
   getDescription() {
     return this.api.translate("Items lets you display personalized products based on user behavior.");
   }
-  getSettingsPanelTitleHtml() {
-    if (f().migrations[m] === 0)
-      return "";
-    const n = this.api.translate("Items"), o = this.api.translate("This block is switched from the Old Version to the New Version. We recommend you check the Items block and test your message to ensure it works properly.");
-    return `<div>
-            <div style="display: flex; align-items: center;">
-                <span>${n}</span>
-            </div>
-            <div class="items-migration-info">
-                <${c.ICON}
-                    ${C.ICON.src}="migration-info-icon"
-                    class="items-migration-info__icon">
-                </${c.ICON}>
-                <p class="items-migration-info__text">
-                    ${o}
-                </p>
-            </div>
-        </div>`;
-  }
   getTemplate() {
-    return y({
-      orientation: l.ORIENTATION.VERTICAL,
-      itemsType: l.ITEMS_TYPE.CART_ITEMS,
+    return p({
+      orientation: c.ORIENTATION.VERTICAL,
+      itemsType: c.ITEMS_TYPE.CART_ITEMS,
       itemId: "{{Abandoned Cart Item (1) Url}}",
-      currencySymbol: s.productPriceCurrencySymbolControlValue,
-      currencyLocation: s.productPriceCurrencyLocationControlValue,
-      formattedPrice: s.productPriceFormattedControlValue === "1"
+      currencySymbol: i.productPriceCurrencySymbolControlValue,
+      currencyLocation: i.productPriceCurrencyLocationControlValue,
+      formattedPrice: i.productPriceFormattedControlValue === "1"
     });
   }
   allowInnerBlocksDND() {
     return !1;
   }
-  onCreated(i) {
-    const n = this.api.getDocumentModifier(), o = this.api.getDocumentRootCssNode();
-    o.querySelector('[product-attr="imageSrc"] img') || n.modifyCss(o).appendRule('[product-attr="imageSrc"] img {object-fit: contain;}');
-    const e = b(i);
+  onCreated(n) {
+    const s = this.api.getDocumentModifier(), r = this.api.getDocumentRootCssNode();
+    r.querySelector('[product-attr="imageSrc"] img') || s.modifyCss(r).appendRule('[product-attr="imageSrc"] img {object-fit: contain;}');
+    const e = u(n);
     if (!e)
       return;
-    const a = e.getNodeConfig(), d = a && Object.keys(a).length > 0, t = k(i);
+    const a = e.getNodeConfig(), l = a && Object.keys(a).length > 0, t = C(n);
     if (t != null && t.initialized)
-      d ? t.blockInstanceId || this.api.getDocumentModifier().modifyHtml(e).setNodeConfig({ ...t, blockInstanceId: String(Date.now()) }).apply(new r("Assign block instance ID to block")) : this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(t).apply(new r("Migrate legacy config to nodeConfig"));
+      l ? t.blockInstanceId || this.api.getDocumentModifier().modifyHtml(e).setNodeConfig({ ...t, blockInstanceId: String(Date.now()) }).apply(new o("Assign block instance ID to block")) : this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(t).apply(new o("Migrate legacy config to nodeConfig"));
     else {
-      const p = N();
-      this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(p).apply(new r("Initialize Items block with default configuration")), g().startOnboarding("itemsOnboarding");
+      const m = I();
+      this.api.getDocumentModifier().modifyHtml(e).setNodeConfig(m).apply(new o("Initialize Items block with default configuration")), d().startOnboarding("itemsOnboarding");
     }
   }
 }
 export {
-  m as BLOCK_ID,
-  M as ItemsBlock
+  y as BLOCK_ID,
+  B as ItemsBlock
 };

package/dist/extensions/Blocks/Items/iconsRegistry.js

@@ -1,6 +1,5 @@
 import { IconsRegistry as o } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { MIGRATION_INFO_ICON as r } from "../common-icons.js";
-class s extends o {
+class i extends o {
   registerIconsSvg(t) {
     t["items-icon"] = `
             <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
@@ -20,14 +19,14 @@ class s extends o {
             </svg>
         `, t["horizontal-orientation"] = `
             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
-                <path d="M10 19H4C3.44772 19 3 18.5523 3 18V2C3 1.44772 3.44772 1 4 1H10V19Z" stroke="currentColor"
+                <path d="M10 19H4C3.44772 19 3 18.5523 3 18V2C3 1.44772 3.44772 1 4 1H10V19Z" stroke="currentColor" 
                     stroke-width="2" fill="none"/>
-                <path d="M17 2V18C17 18.5523 16.5523 19 16 19H10V1H16C16.5523 1 17 1.44772 17 2Z" stroke="currentColor"
+                <path d="M17 2V18C17 18.5523 16.5523 19 16 19H10V1H16C16.5523 1 17 1.44772 17 2Z" stroke="currentColor" 
                     stroke-width="2" fill="none"/>
             </svg>
-        `, t["migration-info-icon"] = r;
+        `;
   }
 }
 export {
-  s as ItemsIconsRegistry
+  i as ItemsIconsRegistry
 };

package/dist/extensions/Blocks/Items/items.css.js

@@ -17,54 +17,6 @@ const n = `/* Utils */
 .container:has(.items-controls-container) {
     padding: 0
 }
-
-/* ─── Migration Info Box ─────────────────────────────────────────────── */
-/* Shown in the settings panel title when a block was migrated from legacy */
-
-/* Layout variables for positioning the absolutely-placed info box */
-:host {
-    --items-migration-padding: 16px;
-    --items-migration-title-height: 61px;
-    --items-migration-box-height: 98px;
-}
-
-/* Push tabs down when info box is present inside the control panel header */
-.control-panel-header:has(.items-migration-info) {
-    position: relative;
-    margin-bottom: calc(2 * var(--items-migration-padding) + var(--items-migration-box-height));
-}
-
-/* Info box container */
-.items-migration-info {
-    display: flex;
-    align-items: flex-start;
-    gap: 8px;
-    padding: 12px;
-    background: var(--guido-color-background-onpage-message-info);
-    border: 1px solid var(--guido-color-border-onpage-message-info);
-    border-radius: 4px;
-    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.07);
-    position: absolute;
-    left: var(--items-migration-padding);
-    right: var(--items-migration-padding);
-    top: calc(var(--items-migration-padding) + var(--items-migration-title-height));
-}
-
-/* Icon — 18x19 icon inside a 24x24 bounding box (matches Figma) */
-.items-migration-info__icon {
-    flex-shrink: 0;
-    width: 24px;
-    height: 24px;
-}
-
-/* Text content */
-.items-migration-info__text {
-    margin: 4px 0;
-    white-space: normal;
-    font-size: 13px;
-    font-weight: 400;
-    line-height: 16px;
-}
 `;
 export {
   n as default

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

@@ -1,14 +1,13 @@
-var h = Object.defineProperty;
-var I = (r, o, t) => o in r ? h(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
-var g = (r, o, t) => I(r, typeof o != "symbol" ? o + "" : o, t);
-import { useTemplateStore as k } from "../../../stores/template.js";
-import { Block as _, BlockCompositionType as B, UIElementType as d, UEAttr as C, ModificationDescription as A } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { ensureMobileCssRulesExist as u } from "./controls/mobileLayout/cssRules.js";
+var p = Object.defineProperty;
+var f = (r, o, t) => o in r ? p(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
+var g = (r, o, t) => f(r, typeof o != "symbol" ? o + "" : o, t);
+import { Block as h, BlockCompositionType as I, ModificationDescription as _ } 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 p } from "./store/recommendation.js";
-import { getDefaultTemplate as R } from "./templates/grid/template.js";
-const f = "recommendation-block", c = "ins-recommendation-v3-block-v2", a = "recommendation-id";
-class E extends _ {
+import { useRecommendationExtensionStore as u } from "./store/recommendation.js";
+import { getDefaultTemplate as k } from "./templates/grid/template.js";
+const B = "recommendation-block", c = "ins-recommendation-v3-block-v2", a = "recommendation-id";
+class y extends h {
   constructor() {
     super();
     /**
@@ -18,13 +17,13 @@ class E extends _ {
     g(this, "_pendingBlockId", null);
   }
   getId() {
-    return f;
+    return B;
   }
   getIcon() {
     return "recommendation-icon";
   }
   getBlockCompositionType() {
-    return B.CONTAINER;
+    return I.CONTAINER;
   }
   getName() {
     return this.api.translate("Recommendation Block");
@@ -32,25 +31,6 @@ class E extends _ {
   getDescription() {
     return this.api.translate("Recommendation Block Title Description");
   }
-  getSettingsPanelTitleHtml() {
-    if (k().migrations[f] === 0)
-      return "";
-    const e = this.api.translate("Recommendation Block"), i = 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.");
-    return `<div>
-            <div style="display: flex; align-items: center;">
-                <span>${e}</span>
-            </div>
-            <div class="recommendation-migration-info">
-                <${d.ICON}
-                    ${C.ICON.src}="migration-info-icon"
-                    class="recommendation-migration-info__icon">
-                </${d.ICON}>
-                <p class="recommendation-migration-info__text">
-                    ${i}
-                </p>
-            </div>
-        </div>`;
-  }
   /**
    * Returns the template HTML for a new recommendation block.
    * Generates a unique recommendation ID and embeds the instance class
@@ -60,7 +40,7 @@ class E extends _ {
    */
   getTemplate() {
     const t = this._generateNextId();
-    return this._pendingBlockId = t, R(t);
+    return this._pendingBlockId = t, k(t);
   }
   /**
    * Called when a new block is dropped into the template
@@ -72,8 +52,8 @@ class E extends _ {
   onCreated(t) {
     const e = this._pendingBlockId ?? this._generateNextId();
     this._pendingBlockId = null, this._assignRecommendationId(t, e);
-    const i = s.initializeConfig(this.api, t, { recommendationId: e }), n = p();
-    n.setCurrentBlock(e), u(this.api), n.patchCurrentBlockConfig({ language: i.language }, { triggerRefetch: !1 });
+    const n = s.initializeConfig(this.api, t, { recommendationId: e }), i = u();
+    i.setCurrentBlock(e), d(this.api), i.patchCurrentBlockConfig({ language: n.language }, { triggerRefetch: !1 });
   }
   /**
    * Called when the document changes or template is loaded
@@ -93,7 +73,7 @@ class E extends _ {
           "Assign recommendation ID to legacy block"
         );
       }
-      s.needsMigration(t) && this._migrateFromLegacy(t), u(this.api);
+      s.needsMigration(t) && this._migrateFromLegacy(t), d(this.api);
     }
   }
   /**
@@ -104,7 +84,7 @@ class E extends _ {
    */
   onDelete(t) {
     const e = this._getRecommendationId(t);
-    e && p().removeBlockState(e);
+    e && u().removeBlockState(e);
   }
   /**
    * Generates the next unique recommendation ID by scanning all existing blocks
@@ -114,9 +94,9 @@ class E extends _ {
     let t = 0;
     try {
       const e = this.api.getDocumentRoot();
-      e && "querySelectorAll" in e && e.querySelectorAll(`.${c}`).forEach((n) => {
-        if ("getAttribute" in n) {
-          const m = n.getAttribute(a), l = m ? parseInt(m) : 0;
+      e && "querySelectorAll" in e && e.querySelectorAll(`.${c}`).forEach((i) => {
+        if ("getAttribute" in i) {
+          const m = i.getAttribute(a), l = m ? parseInt(m) : 0;
           l > t && (t = l);
         }
       });
@@ -131,11 +111,11 @@ class E extends _ {
    * added classes via setAttribute.
    */
   _assignRecommendationId(t, e) {
-    const i = this._getBlockElement(t);
-    if (!i)
+    const n = this._getBlockElement(t);
+    if (!n)
       return;
-    const n = this.api.getDocumentModifier();
-    n.modifyHtml(i).setAttribute(a, e.toString()), n.apply(new A(`Assign recommendation ID ${e}`));
+    const i = this.api.getDocumentModifier();
+    i.modifyHtml(n).setAttribute(a, e.toString()), i.apply(new _(`Assign recommendation ID ${e}`));
   }
   /**
    * Gets the recommendation-id from a block node
@@ -144,11 +124,11 @@ class E extends _ {
     const e = this._getBlockElement(t);
     if (!e || !("getAttribute" in e))
       return null;
-    const i = e.getAttribute(a);
-    if (!i)
+    const n = e.getAttribute(a);
+    if (!n)
       return null;
-    const n = parseInt(i);
-    return Number.isNaN(n) ? null : n;
+    const i = parseInt(n);
+    return Number.isNaN(i) ? null : i;
   }
   /**
    * Gets the block element (the element with BLOCK_CLASS)
@@ -169,6 +149,6 @@ class E extends _ {
   }
 }
 export {
-  f as BLOCK_ID,
-  E as RecommendationBlock
+  B as BLOCK_ID,
+  y as RecommendationBlock
 };

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

@@ -1,6 +1,5 @@
 import { IconsRegistry as r } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { MIGRATION_INFO_ICON as t } from "../common-icons.js";
-class h extends r {
+class o extends r {
   registerIconsSvg(C) {
     C["recommendation-icon"] = `
             <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20" fill="none">
@@ -60,9 +59,9 @@ class h extends r {
                 <circle cx="3" cy="16" r="1" stroke="currentColor" stroke-width="1"/>
                 <rect x="7" y="15" width="11" height="2" rx="1"/>
             </svg>
-        `, C["migration-info-icon"] = t;
+        `;
   }
 }
 export {
-  h as RecommendationIconsRegistry
+  o as RecommendationIconsRegistry
 };

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

@@ -22,54 +22,6 @@ const n = `/* Utils */
 ue-orderable.orderable-disabled .droppable-icon {
     display: none;
 }
-
-/* ─── Migration Info Box ─────────────────────────────────────────────── */
-/* Shown in the settings panel title when a block was migrated from legacy */
-
-/* Layout variables for positioning the absolutely-placed info box */
-:host {
-    --rec-migration-padding: 16px;
-    --rec-migration-title-height: 61px;
-    --rec-migration-box-height: 98px;
-}
-
-/* Push tabs down when info box is present inside the control panel header */
-.control-panel-header:has(.recommendation-migration-info) {
-    position: relative;
-    margin-bottom: calc(2 * var(--rec-migration-padding) + var(--rec-migration-box-height));
-}
-
-/* Info box container */
-.recommendation-migration-info {
-    display: flex;
-    align-items: flex-start;
-    gap: 8px;
-    padding: 12px;
-    background: var(--guido-color-background-onpage-message-info);
-    border: 1px solid var(--guido-color-border-onpage-message-info);
-    border-radius: 4px;
-    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.07);
-    position: absolute;
-    left: var(--rec-migration-padding);
-    right: var(--rec-migration-padding);
-    top: calc(var(--rec-migration-padding) + var(--rec-migration-title-height));
-}
-
-/* Icon — 18x19 icon inside a 24x24 bounding box (matches Figma) */
-.recommendation-migration-info__icon {
-    flex-shrink: 0;
-    width: 24px;
-    height: 24px;
-}
-
-/* Text content */
-.recommendation-migration-info__text {
-    margin: 4px 0;
-    white-space: normal;
-    font-size: 13px;
-    font-weight: 400;
-    line-height: 16px;
-}
 `;
 export {
   n as default

package/dist/extensions/Blocks/common-control.js

@@ -1,5 +1,5 @@
-var l = Object.defineProperty;
-var O = (T, r, e) => r in T ? l(T, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : T[r] = e;
+var I = Object.defineProperty;
+var O = (T, r, e) => r in T ? I(T, r, { enumerable: !0, configurable: !0, writable: !0, value: e }) : T[r] = e;
 var u = (T, r, e) => O(T, typeof r != "symbol" ? r + "" : r, e);
 import { Control as c, UIElementType as n, UEAttr as $ } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 class _ extends c {
@@ -129,14 +129,6 @@ class _ extends c {
             </${n.BUTTON}>
         `;
   }
-  _GuIcon({ src: e, className: t = "" }) {
-    return `
-            <${n.ICON}
-                ${$.ICON.src}="${e}"
-                ${t ? `class="${t}"` : ""}>
-            </${n.ICON}>
-        `;
-  }
   /**
    *
    * @param param0
@@ -175,9 +167,9 @@ class _ extends c {
   _GuOrderable(e, t) {
     let E = "";
     t.forEach((a) => {
-      const I = $.ORDERABLE_ITEM && "name" in $.ORDERABLE_ITEM ? $.ORDERABLE_ITEM.name : "name";
+      const l = $.ORDERABLE_ITEM && "name" in $.ORDERABLE_ITEM ? $.ORDERABLE_ITEM.name : "name";
       E += `
-                <${n.ORDERABLE_ITEM} ${I}="${a.key}">
+                <${n.ORDERABLE_ITEM} ${l}="${a.key}">
                     ${a.content}
                 </${n.ORDERABLE_ITEM}>
             `;