@useinsider/guido 2.2.0-beta.8160e1e → 2.2.0-beta.8abc7b6

package/dist/src/stores/config.d.ts

@@ -46,6 +46,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -141,6 +143,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -236,6 +240,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -331,6 +337,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -426,6 +434,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -521,6 +531,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -616,6 +628,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -711,6 +725,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -806,6 +822,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -901,6 +919,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -996,6 +1016,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1091,6 +1113,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1186,6 +1210,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1281,6 +1307,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1376,6 +1404,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1471,6 +1501,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1566,6 +1598,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;
@@ -1661,6 +1695,8 @@ export declare const useConfigStore: import("pinia").StoreDefinition<"guido-conf
                     senderName: string;
                     subject: string;
                 };
+                savedModulesFolderName: string;
+                defaultModulesFolderName: string;
             };
             ui: {
                 showHeader: boolean;

package/dist/static/styles/customEditorStyle.css.js

@@ -19,22 +19,46 @@ const n = `.esd-x,
     box-shadow: none;
 }
 .ins-product-cart ue-node-actions,
-.ins-recommendation-v3-block-v2 .product-attribute-cell ue-node-actions,
-.ins-recommendation-v3-block-v2 .product-attribute-cell ue-node-panel {
+/* Horizontal layout - hide for info, image, and button cells */
+.ins-recommendation-v3-block-v2 .product-info-cell ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-info-cell ue-node-panel,
+.ins-recommendation-v3-block-v2 .product-image-cell ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-image-cell ue-node-panel,
+.ins-recommendation-v3-block-v2 .button-cell ue-node-actions,
+.ins-recommendation-v3-block-v2 .button-cell ue-node-panel,
+/* Vertical layout - hide for product-card-segment inner cells */
+.ins-recommendation-v3-block-v2 .product-card-segment ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-card-segment ue-node-panel,
+/* Hide for specific product attribute cells in both layouts */
+.ins-recommendation-v3-block-v2 .product-image ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-image ue-node-panel,
+.ins-recommendation-v3-block-v2 .product-name ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-name ue-node-panel,
+.ins-recommendation-v3-block-v2 .product-price ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-price ue-node-panel,
+.ins-recommendation-v3-block-v2 .product-old-price ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-old-price ue-node-panel,
+.ins-recommendation-v3-block-v2 .product-omnibus-price ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-omnibus-price ue-node-panel,
+.ins-recommendation-v3-block-v2 .product-omnibus-discount ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-omnibus-discount ue-node-panel,
+.ins-recommendation-v3-block-v2 .product-button ue-node-actions,
+.ins-recommendation-v3-block-v2 .product-button ue-node-panel {
     display: none !important;
 }
 
-/* Apply to the table cell (td) with text-trim-enabled class */
-.text-trim-enabled {
-    max-width: 0 !important;
+/* Mobile layout: hide mobile container by default in editor */
+.ins-recommendation-mobile-container {
+    display: none;
 }
 
-.text-trim-enabled p {
-    overflow: hidden !important;
-    text-overflow: ellipsis !important;
-    white-space: nowrap !important;
-    margin: 0 !important;
-    display: block !important;
+/* Mobile layout: when Stripo mobile mode is active, swap containers */
+.ue-mobile-mode .ins-recommendation-desktop-container {
+    display: none !important;
+}
+
+.ue-mobile-mode .ins-recommendation-mobile-container {
+    display: table !important;
 }
 `;
 export {

package/dist/utils/pairProductVariables.js

@@ -1,77 +1,77 @@
-import { productPairs as w } from "../extensions/Blocks/Items/enums/productEnums.js";
-function P(k) {
-  const m = k.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), $ = new DOMParser().parseFromString(m, "text/html"), R = w.PAIRS_FOR_EXTENSION;
-  Object.entries(R).forEach(([n, l]) => {
-    $.querySelectorAll(".ins-product-td").forEach((o) => {
-      const E = o.getAttribute("data-number") || "1", b = o.getAttribute("data-type") || "CART_ITEMS";
-      o.querySelectorAll(`[product-attr="${n}"]`).forEach((e) => {
-        var y;
-        const T = e.getAttribute("data-type") || b, u = e.getAttribute("data-number") || E, p = l[T];
+import { productPairs as P } from "../extensions/Blocks/Items/enums/productEnums.js";
+function L(F) {
+  const R = F.replaceAll("{%", "<!--{%").replaceAll("%}", "%}-->"), $ = new DOMParser().parseFromString(R, "text/html"), y = P.PAIRS_FOR_EXTENSION;
+  Object.entries(y).forEach(([n, l]) => {
+    $.querySelectorAll(".ins-product-td").forEach((c) => {
+      const E = c.getAttribute("data-number") || "1", T = c.getAttribute("data-type") || "CART_ITEMS";
+      c.querySelectorAll(`[product-attr="${n}"]`).forEach((e) => {
+        var H;
+        const b = e.getAttribute("data-type") || T, u = e.getAttribute("data-number") || E, p = l[b];
         if (p)
           switch (n) {
             case "imageSrc": {
-              let t = null, c = null;
-              if (e.tagName === "IMG" ? (t = e, c = t.closest("a")) : (t = e.querySelector("img"), c = e.querySelector("a") || e.closest("a")), !t)
+              let t = null, o = null;
+              if (e.tagName === "IMG" ? (t = e, o = t.closest("a")) : (t = e.querySelector("img"), o = e.querySelector("a") || e.closest("a")), !t)
                 break;
               const i = p.DEFAULT, a = p.ATTR;
               if (i && t.src) {
                 const r = t.src;
-                i.some((d) => {
-                  const s = d.split("/").pop() || "", _ = r.split("/").pop() || "";
-                  return r.includes(d) || r.includes(s) || _ === s;
+                i.some((f) => {
+                  const s = f.split("/").pop() || "", _ = r.split("/").pop() || "";
+                  return r.includes(f) || r.includes(s) || _ === s;
                 }) && (t.src = `{{${a}_${u}}}`);
               }
-              if (c) {
-                const r = (y = R.itemLink) == null ? void 0 : y[T];
+              if (o) {
+                const r = (H = y.itemLink) == null ? void 0 : H[b];
                 if (r) {
-                  const f = r.HREF, d = r.DEFAULT_HREF || "#!", s = c.href;
-                  (s === "#" || s === "" || s.endsWith("#!") || s.endsWith(d) || s === `${window.location.href}${d}` || !s || s === window.location.href) && (c.href = `{{${f}_${u}}}`);
+                  const d = r.HREF, f = r.DEFAULT_HREF || "#!", s = o.href;
+                  (s === "#" || s === "" || s.endsWith("#!") || s.endsWith(f) || s === `${window.location.href}${f}` || !s || s === window.location.href) && (o.href = `{{${d}_${u}}}`);
                 }
               }
               break;
             }
             case "name": {
-              const t = p, c = t.ATTR, i = t.DEFAULT_HREF || "#!", a = t.HREF;
-              e.textContent && (e.textContent = `{{${c}_${u}}}`);
+              const t = p, o = t.ATTR, i = t.DEFAULT_HREF || "#!", a = t.HREF;
+              e.textContent && (e.textContent = `{{${o}_${u}}}`);
               const r = e.closest("a") || (e.tagName === "A" ? e : null);
               if (r && a) {
-                const f = r.href, d = `${window.location.href}${i}`;
-                (f === d || f.endsWith(i)) && (r.href = `{{${a}_${u}}}`);
+                const d = r.href, f = `${window.location.href}${i}`;
+                (d === f || d.endsWith(i)) && (r.href = `{{${a}_${u}}}`);
               }
               break;
             }
             case "price":
             case "originalPrice": {
-              const t = p, c = e.getAttribute("data-formated"), i = e.getAttribute("data-single_price"), a = c === "true", r = i === "true", f = e.getAttribute("data-curency") || "before";
-              let d;
-              r ? d = a ? t.SINGLE_PRICE_FORMATTED : t.SINGLE_PRICE : d = a ? t.PRICE_FORMATTED : t.PRICE;
+              const t = p, o = e.getAttribute("data-formated"), i = e.getAttribute("data-single_price"), a = o === "true", r = i === "true", d = e.getAttribute("data-curency") || "before";
+              let f;
+              r ? f = a ? t.SINGLE_PRICE_FORMATTED : t.SINGLE_PRICE : f = a ? t.PRICE_FORMATTED : t.PRICE;
               const s = t.CURRENCY;
-              let _ = `{{${d}_${u}}}`;
+              let _ = `{{${f}_${u}}}`;
               if (s) {
-                const H = `{{${s}_${u}}}`;
-                _ = f === "after" ? `${_} ${H}` : `${H} ${_}`;
+                const k = `{{${s}_${u}}}`;
+                _ = d === "after" ? `${_} ${k}` : `${k} ${_}`;
               }
               e.textContent = _;
               break;
             }
             case "quantity": {
-              const t = p, c = t.ATTR, i = t.DEFAULT;
-              e.textContent && e.textContent.trim() === i && (e.textContent = `{{${c}_${u}}}`);
+              const t = p, o = t.ATTR, i = t.DEFAULT;
+              e.textContent && e.textContent.trim() === i && (e.textContent = `{{${o}_${u}}}`);
               break;
             }
             case "button": {
-              const t = p, c = t.HREF, i = t.DEFAULT_HREF || "#!", a = e.tagName === "A" ? e : e.querySelector("a");
+              const t = p, o = t.HREF, i = t.DEFAULT_HREF || "#!", a = e.tagName === "A" ? e : e.querySelector("a");
               if (a) {
-                const r = a.href || "", f = `${window.location.href}${i}`;
-                (r === "" || r === "#" || r === f || r.endsWith(i) || r.endsWith("#!") || r === window.location.href) && (a.href = `{{${c}_${u}}}`);
+                const r = a.href || "", d = `${window.location.href}${i}`;
+                (r === "" || r === "#" || r === d || r.endsWith(i) || r.endsWith("#!") || r === window.location.href) && (a.href = `{{${o}_${u}}}`);
               }
               break;
             }
             case "itemLink": {
-              const t = p, c = t.HREF, i = t.DEFAULT_HREF || "#!", a = e;
+              const t = p, o = t.HREF, i = t.DEFAULT_HREF || "#!", a = e;
               if (a.href) {
-                const r = a.href, f = `${window.location.href}${i}`;
-                (r === f || r.endsWith(i)) && (a.href = `{{${c}_${u}}}`);
+                const r = a.href, d = `${window.location.href}${i}`;
+                (r === d || r.endsWith(i)) && (a.href = `{{${o}_${u}}}`);
               }
               break;
             }
@@ -86,44 +86,45 @@ function P(k) {
       });
     });
   });
-  const F = $.querySelectorAll(".ins-product-td"), S = [];
-  F.forEach((n) => {
-    const l = n.getAttribute("data-type") || "CART_ITEMS", A = n.getAttribute("data-number") || "1", o = n.getAttribute("data-nodup"), E = n.outerHTML;
-    S.push({
+  const S = R.match(/<!DOCTYPE[^>]*>/i), I = S ? `${S[0]}
+` : "", w = $.querySelectorAll(".ins-product-td"), m = [];
+  w.forEach((n) => {
+    const l = n.getAttribute("data-type") || "CART_ITEMS", A = n.getAttribute("data-number") || "1", c = n.getAttribute("data-nodup"), E = n.outerHTML;
+    m.push({
       element: n,
       outerHtml: E,
       type: l,
       number: A,
-      nodup: o || void 0
+      nodup: c || void 0
     });
   });
-  let h = $.body.innerHTML;
-  S.reverse().forEach(({ outerHtml: n, type: l, number: A }) => {
-    let o = "";
+  let h = I + $.documentElement.outerHTML;
+  m.reverse().forEach(({ outerHtml: n, type: l, number: A }) => {
+    let c = "";
     switch (l) {
       case "CART_ITEMS":
-        o = "ins_apr_total_product_kind";
+        c = "ins_apr_total_product_kind";
         break;
       case "BROWSED_ITEMS":
-        o = "browsed_item_total_product_kind";
+        c = "browsed_item_total_product_kind";
         break;
       case "PURCHASED_ITEMS":
-        o = "purchased_item_total_product_kind";
+        c = "purchased_item_total_product_kind";
         break;
     }
-    if (o) {
-      const b = parseInt(A) - 1, T = `${`{% if ${o} > ${b} %}`}${n}{% endif %}`;
-      h = h.replace(n, T);
+    if (c) {
+      const T = parseInt(A) - 1, b = `${`{% if ${c} > ${T} %}`}${n}{% endif %}`;
+      h = h.replace(n, b);
     }
   });
-  const I = $.querySelectorAll('[product-attr="originalPrice"][data-type="CART_ITEMS"]'), g = [];
-  return I.forEach((n) => {
+  const M = $.querySelectorAll('[product-attr="originalPrice"][data-type="CART_ITEMS"]'), g = [];
+  return M.forEach((n) => {
     const l = n.getAttribute("data-number"), A = n.getAttribute("data-type");
     if (!l || A !== "CART_ITEMS")
       return;
-    const o = n.closest(".product-original-price-class");
-    if (o) {
-      const E = o.outerHTML;
+    const c = n.closest(".product-original-price-class");
+    if (c) {
+      const E = c.outerHTML;
       g.some((C) => C.tdOuterHtml === E) || g.push({ tdOuterHtml: E, number: l });
     }
   }), g.reverse().forEach(({ tdOuterHtml: n, number: l }) => {
@@ -135,5 +136,5 @@ function P(k) {
   }), h.replaceAll("<!--{%", "{%").replaceAll("%}-->", "%}").replaceAll("&lt;!--{%", "{%").replaceAll("%}--&gt;", "%}");
 }
 export {
-  P as pairProductVariables
+  L as pairProductVariables
 };

package/dist/utils/templatePreparation.js

@@ -1,31 +1,32 @@
-import { useActionsApi as b } from "../composables/useActionsApi.js";
-import { useHtmlCompiler as f } from "../composables/useHtmlCompiler.js";
-import { useDynamicContentStore as C } from "../stores/dynamic-content.js";
-import { useUnsubscribeStore as T } from "../stores/unsubscribe.js";
-const P = () => {
-  const i = C(), t = T(), { getCompiledEmail: o, getTemplateData: s, editorSave: n } = b(), { compileHtml: a } = f();
+import { useActionsApi as f } from "../composables/useActionsApi.js";
+import { useHtmlCompiler as C } from "../composables/useHtmlCompiler.js";
+import { useRecommendationExtensionStore as T } from "../extensions/Blocks/Recommendation/store/recommendation.js";
+import { useDynamicContentStore as x } from "../stores/dynamic-content.js";
+import { useUnsubscribeStore as y } from "../stores/unsubscribe.js";
+const E = () => {
+  const o = x(), t = y(), { getCompiledEmail: i, getTemplateData: n, editorSave: s } = f(), { compileHtml: m } = C();
   return {
     prepareTemplateDetails: async () => {
-      const { html: r, ampHtml: m = "", ampErrors: c = [] } = await o({
+      const { html: a, ampHtml: r = "", ampErrors: c = [] } = await i({
         minimize: !0,
         resetDataSavedFlag: !1
-      }), { html: l, css: p, syncModulesIds: u = [] } = await s(), { compiledHtml: d, stats: e, appliedRules: g } = a(r), S = i.getSelectedDynamicContentList;
-      return n(), console.debug("HTML Compilation Stats:", {
+      }), { html: l, css: p, syncModulesIds: u = [] } = await n(), { compiledHtml: d, stats: e, appliedRules: S } = m(a), g = o.getSelectedDynamicContentList, b = T();
+      return s(), console.debug("HTML Compilation Stats:", {
         originalSize: e.originalSize,
         compiledSize: e.compiledSize,
         reduction: `${e.reductionPercentage.toFixed(2)}%`,
-        appliedRules: g,
+        appliedRules: S,
         executionTime: `${e.executionTime.toFixed(2)}ms`
       }), {
-        dynamicContentList: S,
+        dynamicContentList: g,
         compiledHtml: d,
         rawHtml: l,
         css: p,
-        ampHtml: m,
+        ampHtml: r,
         ampErrors: c,
         modules: u,
         recommendation: {
-          campaignUrls: {},
+          campaignUrls: b.recommendationCampaignUrls,
           configs: {}
         },
         unsubscribe: {
@@ -37,5 +38,5 @@ const P = () => {
   };
 };
 export {
-  P as useTemplatePreparation
+  E as useTemplatePreparation
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "2.2.0-beta.8160e1e",
+  "version": "2.2.0-beta.8abc7b6",
   "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
   "main": "./dist/guido.umd.cjs",
   "module": "./dist/library.js",

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

@@ -1,187 +0,0 @@
-import { ModificationDescription as n } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
-import { CommonControl as _ } from "../common-control.js";
-import { ATTR_PRODUCT_IMAGE as m, ATTR_PRODUCT_NAME as y, ATTR_PRODUCT_PRICE as T, ATTR_PRODUCT_OLD_PRICE as h, ATTR_PRODUCT_OMNIBUS_PRICE as C, ATTR_PRODUCT_OMNIBUS_DISCOUNT as f, ATTR_PRODUCT_BUTTON as g } from "./constants.js";
-const R = "ui-elements-recommendation-card-composition", l = ".recommendation-attribute-row", A = "tr.recommendation-product-row", c = "data-card-composition", a = "data-attribute-type", d = "data-visibility", s = [
-  { key: m, label: "Product Image", visible: !0 },
-  { key: y, label: "Product Name", visible: !0 },
-  { key: T, label: "Product Price", visible: !0 },
-  { key: h, label: "Product Original Price", visible: !0 },
-  { key: C, label: "Omnibus Price", visible: !1 },
-  { key: f, label: "Omnibus Discount", visible: !1 },
-  { key: g, label: "Product Button", visible: !0 }
-];
-class N extends _ {
-  getId() {
-    return R;
-  }
-  getTemplate() {
-    const t = s.map((i) => ({
-      key: i.key,
-      label: i.label,
-      content: this._createItemContent(i.label, i.key)
-    }));
-    return `
-            <div class="container">
-                ${this._GuLabel({ text: "Card Element Order & Visibility" })}
-                ${this._GuOrderable("cardComposition", t)}
-            </div>
-        `;
-  }
-  onRender() {
-    this._initializeComposition(), this._registerValueChangeListeners();
-  }
-  onTemplateNodeUpdated(t) {
-    super.onTemplateNodeUpdated(t), this._initializeComposition();
-  }
-  /**
-   * Creates the HTML content for an orderable item with label and toggle
-   */
-  _createItemContent(t, i) {
-    return `
-            <div style="display: flex; align-items: center; justify-content: space-between;
-                padding: 8px; gap: 8px;">
-                <span style="flex: 1;">${t}</span>
-                ${this._GuToggle(`visibility_${i}`)}
-            </div>
-        `;
-  }
-  /**
-   * Registers event listeners for composition and visibility changes
-   */
-  _registerValueChangeListeners() {
-    this.api.onValueChanged("cardComposition", (t) => {
-      this._applyCompositionToBlock(t);
-    }), s.forEach((t) => {
-      this.api.onValueChanged(`visibility_${t.key}`, (i) => {
-        this._applyVisibilityToBlock(t.key, i);
-      });
-    });
-  }
-  /**
-   * Initializes composition order and visibility state from the current node
-   */
-  _initializeComposition() {
-    const t = this._readCompositionFromNode(), i = this._readVisibilityFromRows(), e = {
-      cardComposition: t,
-      ...this._buildVisibilityValues(i)
-    };
-    this.api.updateValues(e);
-  }
-  /**
-   * Reads composition order from node's data-card-composition attribute
-   * Falls back to default order if attribute is not present
-   */
-  _readCompositionFromNode() {
-    if (!this.currentNode || !("getAttribute" in this.currentNode))
-      return s.map((i) => i.key);
-    const t = this.currentNode.getAttribute(c);
-    return t ? t.split(",").filter(Boolean) : s.map((i) => i.key);
-  }
-  /**
-   * Builds visibility values object from the visibility map
-   */
-  _buildVisibilityValues(t) {
-    return s.reduce((i, e) => (i[`visibility_${e.key}`] = t[e.key] ?? !0, i), {});
-  }
-  /**
-   * Read visibility state from individual row elements' data-visibility attributes
-   * This ensures toggles reflect the actual DOM state
-   */
-  _readVisibilityFromRows() {
-    if (!this.currentNode)
-      return this._getDefaultVisibilities();
-    const t = Array.from(this.currentNode.querySelectorAll(l));
-    console.debug("_readVisibilityFromRows - found attribute rows:", t.length);
-    const i = this._extractVisibilityFromRows(t);
-    return this._mergeWithDefaults(i);
-  }
-  /**
-   * Returns default visibility values for all items
-   */
-  _getDefaultVisibilities() {
-    return s.reduce((t, i) => (t[i.key] = i.visible, t), {});
-  }
-  /**
-   * Extracts visibility values from DOM nodes
-   */
-  _extractVisibilityFromRows(t) {
-    const i = {};
-    return t.forEach((e) => {
-      if (!("getAttribute" in e))
-        return;
-      const o = e.getAttribute(a), r = e.getAttribute(d);
-      o && r !== null && (i[o] = this._parseVisibilityValue(r), console.debug(
-        `_readVisibilityFromRows - ${o}: ${i[o]} (raw: ${r})`
-      ));
-    }), i;
-  }
-  /**
-   * Parses visibility value from string to boolean
-   * Accepts "1", "true" as true, everything else as false
-   */
-  _parseVisibilityValue(t) {
-    return t === "1" || t === "true";
-  }
-  /**
-   * Merges extracted visibilities with default values for missing keys
-   */
-  _mergeWithDefaults(t) {
-    return s.forEach((i) => {
-      i.key in t || (t[i.key] = i.visible, console.debug(`_readVisibilityFromRows - ${i.key}: using default ${i.visible}`));
-    }), t;
-  }
-  /**
-   * Apply the reordered composition to the block's HTML structure
-   * Updates the data-card-composition attribute and reorders product attributes
-   */
-  _applyCompositionToBlock(t) {
-    if (console.debug("_applyCompositionToBlock - composition:", t), !this.currentNode) {
-      console.debug("_applyCompositionToBlock - no current node");
-      return;
-    }
-    this.api.getDocumentModifier().modifyHtml(this.currentNode).setAttribute(c, t.join(",")).apply(new n("Update card composition")), this._reorderProductAttributes(t);
-  }
-  /**
-   * Reorders attribute rows within each product row based on composition order
-   */
-  _reorderProductAttributes(t) {
-    if (!this.currentNode)
-      return;
-    const i = this.currentNode.querySelectorAll(A);
-    if (!(i != null && i.length))
-      return;
-    const e = this.api.getDocumentModifier();
-    i.forEach((o) => {
-      const r = this._buildCompositionHtml(o, t);
-      e.modifyHtml(o).setInnerHtml(r);
-    }), e.apply(new n("Reorder product attributes"));
-  }
-  /**
-   * Builds HTML string with attributes ordered according to composition
-   */
-  _buildCompositionHtml(t, i) {
-    return i.reduce((e, o) => {
-      const r = t.querySelector(`${l}[${a}="${o}"]`);
-      return r && "getOuterHTML" in r ? e + r.getOuterHTML() : e;
-    }, "");
-  }
-  /**
-   * Apply visibility changes to the block's HTML structure
-   * Updates display style and data-visibility attribute for all matching rows
-   */
-  _applyVisibilityToBlock(t, i) {
-    if (console.debug("_applyVisibilityToBlock", t, i), !this.currentNode)
-      return;
-    const e = this.currentNode.querySelectorAll(`${l}[${a}="${t}"]`);
-    if (!(e != null && e.length))
-      return;
-    const o = i ? "table-row" : "none", r = i ? "1" : "0", p = `Set ${t} visibility to ${i ? "visible" : "hidden"}`, u = this.api.getDocumentModifier();
-    e.forEach((b) => {
-      u.modifyHtml(b).setStyle("display", o).setAttribute(d, r);
-    }), u.apply(new n(p));
-  }
-}
-export {
-  R as COMPOSITION_CONTROL_BLOCK_ID,
-  N as RecommendationCardCompositionControl
-};