@useinsider/guido 3.2.0 → 3.3.0

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

@@ -1,40 +1,41 @@
-import { useConfig as S } from "../../../composables/useConfig.js";
-import { useRecommendation as _ } from "../../../composables/useRecommendation.js";
-function y(e, u, r, o, s = "") {
-  const n = `{{${s}${e}_${u}_${r}}}`, t = `{{${s}${e}_${u}_currency}}`;
+import { useConfig as g } from "../../../composables/useConfig.js";
+import { useRecommendation as S } from "../../../composables/useRecommendation.js";
+import { useRecommendationExtensionStore as _ } from "../../../extensions/Blocks/Recommendation/store/recommendation.js";
+function y(r, c, e, o, s = "") {
+  const n = `{{${s}${r}_${c}_${e}}}`, t = `{{${s}${r}_${c}_currency}}`;
   return o === "before" ? `${t} ${n}` : `${n} ${t}`;
 }
-function p(e, u, r, o, s, n) {
-  switch (u) {
+function f(r, c, e, o, s, n) {
+  switch (c) {
     case "productImage": {
-      const t = e.querySelector("img");
-      t && (t.setAttribute("src", `{{${n}${r}_${o}_image_url}}`), t.setAttribute("alt", `{{${n}${r}_${o}_name}}`));
-      const c = e.querySelector("a");
-      c && c.setAttribute("href", `{{${n}${r}_${o}_url}}`);
+      const t = r.querySelector("img");
+      t && (t.setAttribute("src", `{{${n}${e}_${o}_image_url}}`), t.setAttribute("alt", `{{${n}${e}_${o}_name}}`));
+      const i = r.querySelector("a");
+      i && i.setAttribute("href", `{{${n}${e}_${o}_url}}`);
       break;
     }
     case "productName": {
-      const t = e.querySelector("p");
+      const t = r.querySelector("p");
       if (t) {
-        const c = t.querySelector("strong") || t;
-        c.textContent = `{{${n}${r}_${o}_name}}`;
+        const i = t.querySelector("strong") || t;
+        i.textContent = `{{${n}${e}_${o}_name}}`;
       }
       break;
     }
     case "productPrice": {
-      const t = e.querySelector("p");
+      const t = r.querySelector("p");
       if (t) {
-        const c = t.querySelector("strong") || t;
-        c.textContent = y(r, o, "price", s, n);
+        const i = t.querySelector("strong") || t;
+        i.textContent = y(e, o, "price", s, n);
       }
       break;
     }
     case "productOldPrice": {
-      const t = e.querySelector("p");
+      const t = r.querySelector("p");
       if (t) {
-        const c = t.querySelector("strong") || t;
-        c.textContent = y(
-          r,
+        const i = t.querySelector("strong") || t;
+        i.textContent = y(
+          e,
           o,
           "original_price",
           s,
@@ -44,92 +45,127 @@ function p(e, u, r, o, s, n) {
       break;
     }
     case "productButton": {
-      const t = e.querySelector("a");
-      t && t.setAttribute("href", `{{${n}${r}_${o}_url}}`);
+      const t = r.querySelector("a");
+      t && t.setAttribute("href", `{{${n}${e}_${o}_url}}`);
       break;
     }
     case "productOmnibusPrice": {
-      const t = e.querySelector(".omnibus-price-value");
+      const t = r.querySelector(".omnibus-price-value");
       if (t) {
-        t.textContent = `{{${n}${r}_${o}_omnibus_price}}`;
-        const c = t.closest("p");
-        c && (c.setAttribute("product-attr", "omnibus_price"), c.setAttribute("composition", "true"));
+        t.textContent = `{{${n}${e}_${o}_omnibus_price}}`;
+        const i = t.closest("p");
+        i && (i.setAttribute("product-attr", "omnibus_price"), i.setAttribute("composition", "true"));
       }
       break;
     }
     case "productOmnibusDiscount": {
-      const t = e.querySelector(".omnibus-discount-value");
+      const t = r.querySelector(".omnibus-discount-value");
       if (t) {
-        t.textContent = `{{${n}${r}_${o}_omnibus_discount}}`;
-        const c = t.closest("p");
-        c && (c.setAttribute("product-attr", "omnibus_discount"), c.setAttribute("composition", "true"));
+        t.textContent = `{{${n}${e}_${o}_omnibus_discount}}`;
+        const i = t.closest("p");
+        i && (i.setAttribute("product-attr", "omnibus_discount"), i.setAttribute("composition", "true"));
       }
       break;
     }
     default: {
-      const t = e.getAttribute("product-attr") ? e : e.querySelector("[product-attr]");
+      const t = r.getAttribute("product-attr") ? r : r.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 i = t.getAttribute("product-attr"), a = t.querySelector("p");
+        if (a) {
+          const u = a.querySelector("strong") || a;
+          u.textContent = `{{${n}${e}_${o}_${i}}}`;
         }
       }
       break;
     }
   }
 }
-function d(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);
+function q(r, c, e, o) {
+  r.querySelectorAll(".recommendation-product-row").forEach((n, t) => {
+    n.querySelectorAll("[data-attribute-type]").forEach((a) => {
+      const u = a.getAttribute("data-attribute-type") || "", p = a.querySelectorAll(".attribute-cell");
+      p.length > 0 ? p.forEach((l) => {
+        f(l, u, c, t, e, o);
+      }) : f(a, u, c, t, e, o);
     });
   });
 }
-function q(e, u, r, o) {
-  const s = e.querySelectorAll(".recommendation-product-row");
+function w(r, c, e, o) {
+  const s = r.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);
+  const [n] = s, t = n.querySelector("[data-attribute-type]"), i = t ? t.querySelectorAll(".attribute-cell").length : 1;
+  s.forEach((a, u) => {
+    a.querySelectorAll("[data-attribute-type]").forEach((l) => {
+      const d = l.getAttribute("data-attribute-type") || "";
+      l.querySelectorAll(".attribute-cell").forEach((A, h) => {
+        const $ = u * i + h;
+        f(A, d, c, $, e, o);
       });
     });
   });
 }
-function g(e, u, r, o) {
-  e.querySelectorAll(".ins-recommendation-product-container").forEach((n) => {
-    q(n, u, r, o);
+function E(r, c, e, o) {
+  r.querySelectorAll(".ins-recommendation-product-container").forEach((n) => {
+    w(n, c, e, o);
   });
 }
-function h(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);
+function C(r, c, e) {
+  const o = r.getAttribute("data-layout") || "grid", s = r.getAttribute("currency-alignment") || "after";
+  o === "list" ? q(r, c, s, e) : E(r, c, s, e);
 }
-function C(e, u) {
-  const r = e.match(/<!DOCTYPE[^>]*>/i);
-  return (r ? `${r[0]}
-` : "") + u.documentElement.outerHTML;
+function b(r, c, e) {
+  const o = new RegExp(`${c}\\s*:\\s*(\\d+)\\s*px`, "i"), s = r.match(o);
+  return s ? parseInt(s[1]) : e;
 }
-function P(e) {
-  const u = e.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), r = new DOMParser().parseFromString(u, "text/html"), o = r.querySelectorAll(".recommendation-block-v2");
+function P(r, c) {
+  let e = r.parentElement;
+  for (; e && e !== c; ) {
+    if (e.tagName === "TD") {
+      const o = e.getAttribute("width");
+      if (o && o.endsWith("%") && parseFloat(o) < 100)
+        return e;
+    }
+    e = e.parentElement;
+  }
+  return null;
+}
+function R(r) {
+  const c = r.getAttribute("style") || "", e = b(c, "width", 600), o = b(c, "padding", 0) * 2, s = Math.max(0, e - o);
+  s !== 0 && r.querySelectorAll("img.adapt-img").forEach((n) => {
+    if (n.hasAttribute("width"))
+      return;
+    const t = P(n, r);
+    if (!t)
+      return;
+    const i = t.getAttribute("width"), a = parseFloat(i), u = b(t.getAttribute("style") || "", "padding", 0) * 2, p = Math.floor(s * a / 100), l = Math.max(1, p - u);
+    n.setAttribute("width", String(l));
+    const d = n.getAttribute("style") || "";
+    if (!/\bwidth\s*:\s*\d/i.test(d)) {
+      const m = d && !d.trim().endsWith(";") ? "; " : "";
+      n.setAttribute("style", `${d}${m}width: ${l}px`);
+    }
+  });
+}
+function v(r, c) {
+  const e = r.match(/<!DOCTYPE[^>]*>/i);
+  return (e ? `${e[0]}
+` : "") + c.documentElement.outerHTML;
+}
+function O(r) {
+  const c = r.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), e = new DOMParser().parseFromString(c, "text/html"), o = e.querySelectorAll(".recommendation-block-v2");
   if (!o.length)
-    return e;
-  const { buildCampaignUrl: s } = _(), { isFeatureEnabled: n } = S(), t = n("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;", "%}");
+    return r;
+  const { buildCampaignUrl: s } = S(), n = _();
+  n.recommendationCampaignUrls = {};
+  const { isFeatureEnabled: t } = g(), i = t("liquidSyntax") ? "reco_" : "";
+  return o.forEach((u) => {
+    var l, d;
+    const p = u.getAttribute("recommendation-id");
+    p && ((l = u.parentNode) == null || l.insertBefore(e.createComment("REC_START"), u), (d = u.parentNode) == null || d.insertBefore(e.createComment("REC_END"), u.nextSibling), u.querySelectorAll('[data-visibility="0"]').forEach((m) => m.remove()), s(p), C(u, p, i), R(u));
+  }), v(c, e).replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("&lt;!--{%", "{%").replaceAll("%}--&gt;", "%}");
 }
 export {
   y as formatPriceVariable,
-  P as prepareRecommendationBlocks
+  O as prepareRecommendationBlocks
 };

package/dist/config/migrator/index.js

@@ -1,13 +1,13 @@
-import { migrateCheckbox as t } from "./checkboxMigrator.js";
-import { migrateCouponBlock as o } from "./couponBlockMigrator.js";
-import { migrateItemsBlock as i } from "./itemsBlockMigrator.js";
-import { migrateRadioButton as e } from "./radioButtonMigrator.js";
-import { migrateRecommendation as a } from "./recommendationMigrator.js";
-import { migrateUnsubscribe as g } from "./unsubscribeMigrator.js";
-const u = async (r) => {
+import { migrateCheckbox as o } from "./checkboxMigrator.js";
+import { migrateCouponBlock as i } from "./couponBlockMigrator.js";
+import { migrateItemsBlock as e } from "./itemsBlockMigrator.js";
+import { migrateRadioButton as a } from "./radioButtonMigrator.js";
+import { migrateRecommendation as g } from "./recommendationMigrator.js";
+import { migrateUnsubscribe as n } from "./unsubscribeMigrator.js";
+const b = async (r, t = {}) => {
   let m = r;
-  return m = t(m), m = e(m), m = await g(m), m = o(m), m = a(m), m = i(m), m;
+  return m = o(m), m = a(m), m = await n(m), m = i(m), m = g(m, t), m = e(m), m;
 };
 export {
-  u as migrate
+  b as migrate
 };

package/dist/config/migrator/radioButtonMigrator.js

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

package/dist/config/migrator/recommendation/compositionMapper.js

@@ -0,0 +1,98 @@
+import { DEFAULT_COMPOSITION as d, DEFAULT_VISIBILITY as I } from "../../../extensions/Blocks/Recommendation/constants/defaultConfig.js";
+import { ATTR_CUSTOM_PREFIX as l, ATTR_PRODUCT_BUTTON as k, ATTR_PRODUCT_OMNIBUS_DISCOUNT as A, ATTR_PRODUCT_OMNIBUS_PRICE as x, ATTR_PRODUCT_OLD_PRICE as f, ATTR_PRODUCT_PRICE as R, ATTR_PRODUCT_NAME as h, ATTR_PRODUCT_IMAGE as y } from "../../../extensions/Blocks/Recommendation/constants/selectors.js";
+import { mapTextTheme as E, mapButtonTheme as O, mapImageTheme as b } from "./themeMapper.js";
+const C = "__title__", a = "product_attribute.";
+function N(r) {
+  const t = r.variable ?? "";
+  switch (t) {
+    case "p_recommendation_title":
+      return { key: C, kind: "title" };
+    case "p_image":
+      return { key: y, kind: "image" };
+    case "p_name":
+      return { key: h, kind: "text" };
+    case "p_price":
+      return { key: R, kind: "text" };
+    case "p_original_price":
+      return { key: f, kind: "text" };
+    case "p_omnibus_price":
+      return { key: x, kind: "text" };
+    case "p_omnibus_discount":
+      return { key: A, kind: "text" };
+    case "p_button":
+      return { key: k, kind: "button" };
+    default:
+      if (r.variableType === "p_attribute" || t.startsWith("p_attribute_")) {
+        const s = r.value ?? "", o = s.startsWith(a) ? s.slice(a.length) : s;
+        return o ? {
+          key: `${l}${o}`,
+          kind: "custom",
+          customAttrName: o,
+          customAttrValue: s || `${a}${o}`
+        } : null;
+      }
+      return null;
+  }
+}
+function p(r) {
+  const t = d.indexOf(r);
+  return t === -1 ? Number.POSITIVE_INFINITY : t;
+}
+function S(r) {
+  const t = {
+    composition: [],
+    visibility: { ...I },
+    customAttributes: [],
+    customAttrValues: {},
+    perElementStyles: {},
+    anyTextTrimming: !1
+  };
+  if (!r || r.length === 0)
+    return t.composition = [...d], t;
+  const s = [];
+  r.forEach((e, i) => {
+    const n = N(e);
+    if (n) {
+      if (n.kind === "title") {
+        t.titleVariable = e;
+        return;
+      }
+      s.push({
+        key: n.key,
+        kind: n.kind,
+        hidden: e.hidden === !0,
+        positionIdx: typeof e.positionIdx == "number" ? e.positionIdx : Number.MAX_SAFE_INTEGER,
+        legacy: e,
+        customAttrName: n.customAttrName,
+        customAttrValue: n.customAttrValue,
+        originalIndex: i
+      });
+    }
+  }), s.sort((e, i) => {
+    if (e.positionIdx !== i.positionIdx)
+      return e.positionIdx - i.positionIdx;
+    const n = p(e.key), u = p(i.key);
+    return n !== u ? n - u : e.originalIndex - i.originalIndex;
+  });
+  const o = {};
+  return s.forEach((e) => {
+    const { key: i, kind: n, hidden: u, legacy: m, customAttrName: c, customAttrValue: T } = e;
+    switch (t.composition.push(i), t.visibility[i] = !u, n === "custom" && c && T && (t.customAttributes.includes(c) || t.customAttributes.push(c), t.customAttrValues[i] = T), n) {
+      case "image":
+        o[i] = b(m.theme);
+        break;
+      case "button":
+        o[i] = O(m.theme);
+        break;
+      case "text":
+      case "custom": {
+        const _ = E(m.theme);
+        o[i] = _, _.textTrimming && (t.anyTextTrimming = !0);
+        break;
+      }
+    }
+  }), t.perElementStyles = o, t;
+}
+export {
+  S as mapComposition
+};

package/dist/config/migrator/recommendation/extractors.js

@@ -0,0 +1,27 @@
+const i = "You May Also Like!";
+function s(r) {
+  var e;
+  const o = r.querySelector(".ext-recommendation-title");
+  if (!o)
+    return i;
+  const t = (e = o.textContent) == null ? void 0 : e.trim();
+  return t && t.length > 0 ? t : i;
+}
+function u(r) {
+  const o = [
+    r,
+    ...Array.from(r.querySelectorAll(".product-card, .ext-recommendation-card"))
+  ];
+  let t = "";
+  return o.some((e) => {
+    const n = e.getAttribute("bgcolor");
+    if (n && n.trim())
+      return t = n.trim(), !0;
+    const c = (e.getAttribute("style") ?? "").match(/background-color\s*:\s*([^;]+)/i);
+    return c && c[1] ? (t = c[1].trim(), !0) : !1;
+  }), t;
+}
+export {
+  u as extractCardBgColor,
+  s as extractTitleText
+};