@useinsider/guido 2.0.0-beta.6e688eb → 2.0.0-beta.759c7d4

package/dist/composables/useSave.js

@@ -1,15 +1,17 @@
-import { useSaveStart as i, useSaveComplete as m } from "./useGuidoActions.js";
-import { useTemplatePreparation as n } from "../utils/templatePreparation.js";
-import { useHtmlValidator as l } from "./useHtmlValidator.js";
-const f = () => {
-  const e = i(), a = m(), { validateHtml: s } = l();
-  return { save: async (o = !1) => {
-    e();
-    const { prepareTemplateDetails: r } = n(), t = await r();
-    if (await s(t.compiledHtml, t.dynamicContentList, !0))
-      return o || a(t), t;
+import { useConfig as l } from "./useConfig.js";
+import { useSaveStart as m, useSaveComplete as c } from "./useGuidoActions.js";
+import { useTemplatePreparation as d } from "../utils/templatePreparation.js";
+import { useHtmlValidator as p } from "./useHtmlValidator.js";
+const w = () => {
+  const i = m(), s = c(), { validateHtml: o } = p(), { callbacks: a } = l();
+  return { save: async (r = !1) => {
+    var e;
+    i();
+    const { prepareTemplateDetails: n } = d(), t = await n();
+    if (await o(t.compiledHtml, t.dynamicContentList, !0) && !((e = a.value) != null && e.externalValidation && !await a.value.externalValidation(t)))
+      return r || s(t), t;
   } };
 };
 export {
-  f as useSave
+  w as useSave
 };

package/dist/composables/useStripo.js

@@ -1,26 +1,26 @@
-import { useActionsApi as T } from "./useActionsApi.js";
-import { useBlocksConfig as V } from "./useBlocksConfig.js";
-import { useConfig as _ } from "./useConfig.js";
-import { useCustomInterfaceAppearance as B } from "./useCustomInterfaceAppearance.js";
-import { useStripoEventHandler as v } from "./useStripoEventHandler.js";
-import { useToaster as A } from "./useToaster.js";
-import { displayConditions as F } from "../enums/displayConditions.js";
-import { useStripoApi as D } from "../services/stripoApi.js";
-import I from "../static/styles/customEditorStyle.css.js";
-import { useEditorStore as M } from "../stores/editor.js";
-import { dynamicContentToMergeTags as U } from "../utils/genericUtil.js";
-import P from "../package.json.js";
-const K = (c) => {
-  const { features: l } = _(), { handleError: u } = A(), { getToken: y, getCustomFonts: S } = D(), { handleEvent: C } = v(), { getStripoBlocksConfig: E } = V(), h = async (i, n = []) => {
-    var g, f;
-    const o = M(), { html: r, css: p, forceRecreate: a } = i, { baseBlocks: t, extensions: d } = await E(), m = ((g = l.value) == null ? void 0 : g.displayConditions) ?? !0, b = ((f = l.value) == null ? void 0 : f.modulesDisabled) ?? !1;
+import { useActionsApi as _ } from "./useActionsApi.js";
+import { useBlocksConfig as B } from "./useBlocksConfig.js";
+import { useConfig as v } from "./useConfig.js";
+import { useCustomInterfaceAppearance as A } from "./useCustomInterfaceAppearance.js";
+import { useStripoEventHandler as F } from "./useStripoEventHandler.js";
+import { useToaster as D } from "./useToaster.js";
+import { displayConditions as I } from "../enums/displayConditions.js";
+import { useStripoApi as M } from "../services/stripoApi.js";
+import U from "../static/styles/customEditorStyle.css.js";
+import { useEditorStore as P } from "../stores/editor.js";
+import { dynamicContentToMergeTags as R } from "../utils/genericUtil.js";
+import H from "../package.json.js";
+const W = (c) => {
+  const { features: l, template: y } = v(), { handleError: u } = D(), { getToken: C, getCustomFonts: S } = M(), { handleEvent: E } = F(), { getStripoBlocksConfig: h } = B(), w = async (i, n = []) => {
+    var m, g, f;
+    const o = P(), { html: r, css: p } = i, { baseBlocks: s, extensions: t } = await h(), a = ((m = l.value) == null ? void 0 : m.displayConditions) ?? !0, k = ((g = l.value) == null ? void 0 : g.modulesDisabled) ?? !1, T = ((f = y.value) == null ? void 0 : f.forceRecreate) ?? !1;
     window.UIEditor.initEditor(
       document.querySelector("#guido-editor"),
       {
         metadata: c,
         html: r,
         css: p,
-        forceRecreate: a,
+        forceRecreate: T,
         locale: "en",
         undoButtonSelector: "#guido__undo-button",
         redoButtonSelector: "#guido__redo-button",
@@ -30,19 +30,19 @@ const K = (c) => {
         customAppearanceMergetags: !0,
         customAppearanceMergetagsBorderColor: "#f1f3fe",
         customAppearanceMergetagsBackgroundColor: "#f1f3fe",
-        customViewStyles: I,
-        conditionsEnabled: m,
-        customConditionsEnabled: m,
-        conditionCategories: F,
+        customViewStyles: U,
+        conditionsEnabled: a,
+        customConditionsEnabled: a,
+        conditionCategories: I,
         enableXSSSecurity: !0,
-        modulesDisabled: b,
+        modulesDisabled: k,
         messageSettingsEnabled: !0,
         displayGmailAnnotations: !0,
         displayHiddenPreheader: !1,
         displayTitle: !1,
         displayUTM: !1,
         selectElementAfterDrop: !0,
-        ...t ? { baseBlocks: t } : {},
+        ...s ? { baseBlocks: s } : {},
         editorFonts: {
           showDefaultStandardFonts: !0,
           showDefaultNotStandardFonts: !0,
@@ -50,21 +50,21 @@ const K = (c) => {
         },
         mergeTags: [
           {
-            entries: U(c.preselectedDynamicContentList)
+            entries: R(c.preselectedDynamicContentList)
           }
         ],
         async onTokenRefreshRequest(e) {
           try {
-            const s = await y();
-            e(s);
-          } catch (s) {
-            u(s, "Failed to refresh token");
+            const d = await C();
+            e(d);
+          } catch (d) {
+            u(d, "Failed to refresh token");
           }
         },
         onTemplateLoaded() {
           try {
-            const { importCss: e } = B(), { activateCustomViewStyles: s, updateTimerInClonedTemplate: k } = T();
-            e(), s(), k(), c.onReady(), o.isStripoInitialized = !0, o.loadingStatus = !1, setTimeout(() => {
+            const { importCss: e } = A(), { activateCustomViewStyles: d, updateTimerInClonedTemplate: V } = _();
+            e(), d(), V(), c.onReady(), o.isStripoInitialized = !0, o.loadingStatus = !1, setTimeout(() => {
               o.hasChanges = !1;
             }, 1e3);
           } catch (e) {
@@ -83,35 +83,35 @@ const K = (c) => {
         onDataChanged() {
           o.hasChanges = !0;
         },
-        onEvent: C,
+        onEvent: E,
         ignoreClickOutsideSelectors: [
           "#guido-dynamic-content-modal",
           ".in-on-board-wrapper",
           ".in-drawer__container"
         ],
-        extensions: d
+        extensions: t
       }
     );
-  }, w = (i) => new Promise((n, o) => {
-    var d;
+  }, b = (i) => new Promise((n, o) => {
+    var a;
     if (document.getElementById("UiEditorScript")) {
       i(), n();
       return;
     }
-    const r = P.guido, a = `https://email-static.useinsider.com/guido/${(d = r == null ? void 0 : r.stripo) == null ? void 0 : d.version}/UIEditor.js`, t = document.createElement("script");
-    t.id = "UiEditorScript", t.type = "module", t.src = a, t.onload = () => {
+    const r = H.guido, s = `https://email-static.useinsider.com/guido/${(a = r == null ? void 0 : r.stripo) == null ? void 0 : a.version}/UIEditor.js`, t = document.createElement("script");
+    t.id = "UiEditorScript", t.type = "module", t.src = s, t.onload = () => {
       i(), n();
     }, t.onerror = () => {
-      o(new Error(`Failed to load Stripo UIEditor script from S3: ${a}`));
+      o(new Error(`Failed to load Stripo UIEditor script from S3: ${s}`));
     }, document.body.appendChild(t);
   });
   return { initPlugin: async (i) => {
-    await w(async () => {
+    await b(async () => {
       const n = await S();
-      await h(i, n);
+      await w(i, n);
     });
   } };
 };
 export {
-  K as useStripo
+  W as useStripo
 };

package/dist/enums/academy.js

@@ -0,0 +1,8 @@
+const e = "https://academy.useinsider.com", o = {
+  EMAIL_EDITOR: `${e}/docs/email-drag-drop-editor`,
+  GLOBAL_UNSUBSCRIBE: `${e}/docs/global-unsubscribe-preference-center`,
+  AMP_FOR_EMAILS: `${e}/docs/amp-for-emails`
+};
+export {
+  o as ACADEMY_LINKS
+};

package/dist/enums/onboarding.js

@@ -2,9 +2,8 @@ const e = [
   ".service-element.stacked-panel-item.ng-tns-c1014751574-3.level-bottom-0.ng-star-inserted",
   ".service-element.stacked-panel-item.ng-tns-c1014751574-3.level-bottom-1.ng-star-inserted",
   ".service-element.stacked-panel-item.ng-tns-c1014751574-3.level-bottom-2.ng-star-inserted"
-], t = "ui-editor", n = 'button[role="tab"][aria-label="Card Composition"]', s = 'button[role="tab"][aria-label="Settings"]', o = ".in-ribbons-wrapper", a = "https://academy.useinsider.com/docs/email-drag-drop-editor";
+], t = "ui-editor", n = 'button[role="tab"][aria-label="Card Composition"]', s = 'button[role="tab"][aria-label="Settings"]', o = ".in-ribbons-wrapper";
 export {
-  a as ACADEMY_LINK,
   n as CARD_COMPOSITION_TAB_SELECTOR,
   o as RIBBON_SELECTOR,
   e as SERVICE_HOVER_SELECTORS,

package/dist/enums/unsubscribe.js

@@ -1,26 +1,26 @@
-import { useTranslations as n } from "../composables/useTranslations.js";
+import { useTranslations as e } from "../composables/useTranslations.js";
 import { getEnvironmentPrefix as R } from "../utils/environmentUtil.js";
-const N = {
+const I = {
   UNSUBSCRIBE_LINK_TYPE: 1,
   PREFERENCES_LINK_TYPE: 3
-}, I = {
+}, r = {
   UNSUBSCRIBE_LINK_REGEX: /{{ins-unsubscribe-link}}/g,
   DATA_OGSB_BUTTON_CSS_REGEX: "\\[data-ogsb\\]\\s*\\.es-button\\.es-button-[0-9]+\\s*\\{(?:[^\\}]*)\\}",
   GLOBAL_UNSUBSCRIBE_LINK_REGEX: /{{ins-global-unsubscribe-link}}/g,
   PREFERENCES_UNSUBSCRIBE_LINK_REGEX: /{{ins-preferences-unsubscribe-link}}/g
-}, s = R(), i = {
+}, s = R(), _ = {
   UNSUBSCRIBE_URL: `https://mail.${s}.com/user/v1/unsub`,
   PREFERENCES_URL: `https://mail.${s}.com/user/v1/prefs`
-}, _ = "iid", B = {
+}, i = "iid", B = {
   name: "Global Unsubscribe",
   sendGridId: "G"
-}, t = "https://academy.useinsider.com/docs/global-unsubscribe-preference-center", C = "/email/unsubscribe-pages", E = {
+}, C = "/email/unsubscribe-pages", E = {
   GLOBAL_UNSUBSCRIBE: 1,
   GLOBAL_UNSUBSCRIBE_CONFIRMATION_PAGE: 2,
   SUBSCRIPTION_PREFERENCE_CENTER: 3,
   SUBSCRIPTION_PREFERENCE_CONFIRMATION: 4,
   RESUBSCRIBE: 5
-}, c = {
+}, t = {
   [E.GLOBAL_UNSUBSCRIBE]: [
     E.GLOBAL_UNSUBSCRIBE,
     E.GLOBAL_UNSUBSCRIBE_CONFIRMATION_PAGE,
@@ -31,29 +31,28 @@ const N = {
     E.SUBSCRIPTION_PREFERENCE_CONFIRMATION
   ]
 }, U = () => {
-  const e = n();
+  const n = e();
   return {
-    [E.GLOBAL_UNSUBSCRIBE]: e("unsubscription-preference.type-global-unsubscribe"),
-    [E.GLOBAL_UNSUBSCRIBE_CONFIRMATION_PAGE]: e("unsubscription-preference.type-global-unsubscription-confirmation"),
-    [E.RESUBSCRIBE]: e("unsubscription-preference.type-resubscribe"),
-    [E.SUBSCRIPTION_PREFERENCE_CENTER]: e("unsubscription-preference.type-subscription-preferences-center"),
-    [E.SUBSCRIPTION_PREFERENCE_CONFIRMATION]: e("unsubscription-preference.type-subscription-preferences-confirmation")
+    [E.GLOBAL_UNSUBSCRIBE]: n("unsubscription-preference.type-global-unsubscribe"),
+    [E.GLOBAL_UNSUBSCRIBE_CONFIRMATION_PAGE]: n("unsubscription-preference.type-global-unsubscription-confirmation"),
+    [E.RESUBSCRIBE]: n("unsubscription-preference.type-resubscribe"),
+    [E.SUBSCRIPTION_PREFERENCE_CENTER]: n("unsubscription-preference.type-subscription-preferences-center"),
+    [E.SUBSCRIPTION_PREFERENCE_CONFIRMATION]: n("unsubscription-preference.type-subscription-preferences-confirmation")
   };
-}, o = {
+}, c = {
   default: "{{ins-unsubscribe-link}}",
   [E.GLOBAL_UNSUBSCRIBE]: "{{ins-global-unsubscribe-link}}",
   [E.SUBSCRIPTION_PREFERENCE_CENTER]: "{{ins-preferences-unsubscribe-link}}"
 };
 export {
-  t as ACADEMY_LINK,
   B as DEFAULT_UNSUBSCRIBE_GROUP,
-  _ as INSIDER_ID,
-  I as LINK_REGEXES,
-  N as LINK_TYPES,
-  o as MERGE_TAGS,
+  i as INSIDER_ID,
+  r as LINK_REGEXES,
+  I as LINK_TYPES,
+  c as MERGE_TAGS,
   E as PAGE_TYPES,
-  c as TYPE_COLLECTIONS,
+  t as TYPE_COLLECTIONS,
   C as UNSUBSCRIBE_PAGES_LINK,
-  i as URLS,
+  _ as URLS,
   U as getTypeTranslations
 };

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

@@ -1,187 +1,103 @@
-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 }
+var m = Object.defineProperty;
+var y = (n, o, i) => o in n ? m(n, o, { enumerable: !0, configurable: !0, writable: !0, value: i }) : n[o] = i;
+var a = (n, o, i) => y(n, typeof o != "symbol" ? o + "" : o, i);
+import { ModificationDescription as u } from "../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
+import { CommonControl as b } from "../common-control.js";
+const h = "ui-elements-recommendation-card-composition", s = [
+  { key: "productImage", label: "Product Image", visible: !0 },
+  { key: "productName", label: "Product Name", visible: !0 },
+  { key: "productPrice", label: "Product Price", visible: !0 },
+  { key: "productOriginalPrice", label: "Product Original Price", visible: !0 },
+  { key: "productButton", label: "Product Button", visible: !0 }
 ];
-class N extends _ {
+class g extends b {
+  constructor() {
+    super(...arguments);
+    a(this, "currentComposition", []);
+    a(this, "currentVisibility", {});
+  }
   getId() {
-    return R;
+    return h;
   }
   getTemplate() {
-    const t = s.map((i) => ({
-      key: i.key,
-      label: i.label,
-      content: this._createItemContent(i.label, i.key)
+    const i = s.map((e) => ({
+      key: e.key,
+      label: e.label,
+      content: `
+                <div style="display: flex; align-items: center; justify-content: space-between;
+                    padding: 8px; gap: 8px;">
+                    <span style="flex: 1;">${e.label}</span>
+                    ${this._GuToggle(`visibility_${e.key}`)}
+                </div>
+            `
     }));
     return `
             <div class="container">
                 ${this._GuLabel({ text: "Card Element Order & Visibility" })}
-                ${this._GuOrderable("cardComposition", t)}
+                ${this._GuOrderable("cardComposition", i)}
             </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);
+    this._initializeComposition(), this.api.onValueChanged("cardComposition", (i) => {
+      this.currentComposition = i, this._applyCompositionToBlock(i);
+    }), s.forEach((i) => {
+      this.api.onValueChanged(`visibility_${i.key}`, (e) => {
+        this.currentVisibility[i.key] = e, this._applyVisibilityToBlock();
       });
     });
   }
+  onTemplateNodeUpdated(i) {
+    super.onTemplateNodeUpdated(i), this._initializeComposition();
+  }
   /**
-   * Initializes composition order and visibility state from the current node
+   * Initialize the composition order and visibility from the block or use defaults
    */
   _initializeComposition() {
-    const t = this._readCompositionFromNode(), i = this._readVisibilityFromRows(), e = {
-      cardComposition: t,
-      ...this._buildVisibilityValues(i)
+    var p;
+    const i = (p = this.currentNode) == null ? void 0 : p.querySelector(".ins-recommendation-v3-block-v2");
+    let e = null, l = null;
+    if (i && "getAttribute" in i && (e = i.getAttribute("data-card-composition"), l = i.getAttribute("data-card-visibility")), e) {
+      const t = e.split(",").filter(Boolean), r = s.map((c) => c.key);
+      t.every((c) => r.includes(c)) && t.length > 0 ? this.currentComposition = t : this.currentComposition = r;
+    } else
+      this.currentComposition = s.map((t) => t.key);
+    if (l)
+      try {
+        const t = JSON.parse(l);
+        this.currentVisibility = t;
+      } catch {
+        this.currentVisibility = s.reduce((t, r) => (t[r.key] = r.visible, t), {});
+      }
+    else
+      this.currentVisibility = s.reduce((t, r) => (t[r.key] = r.visible, t), {});
+    const d = {
+      cardComposition: this.currentComposition
     };
-    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;
+    s.forEach((t) => {
+      d[`visibility_${t.key}`] = this.currentVisibility[t.key] ?? !0;
+    }), this.api.updateValues(d);
   }
   /**
    * 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) {
+  _applyCompositionToBlock(i) {
     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;
-    }, "");
+    const e = this.currentNode.querySelector(".ins-recommendation-v3-block-v2");
+    e && this.api.getDocumentModifier().modifyHtml(e).setAttribute("data-card-composition", i.join(",")).apply(new u("Stored card composition order"));
   }
   /**
    * 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))
+  _applyVisibilityToBlock() {
+    if (!this.currentNode)
       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));
+    const i = this.currentNode.querySelector(".ins-recommendation-v3-block-v2");
+    i && this.api.getDocumentModifier().modifyHtml(i).setAttribute("data-card-visibility", JSON.stringify(this.currentVisibility)).apply(new u("Stored card visibility settings"));
   }
 }
 export {
-  R as COMPOSITION_CONTROL_BLOCK_ID,
-  N as RecommendationCardCompositionControl
+  h as COMPOSITION_CONTROL_BLOCK_ID,
+  g as RecommendationCardCompositionControl
 };

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

@@ -1,13 +1,5 @@
-const _ = "productImage", b = "productName", n = "productPrice", i = "productOldPrice", O = "productOmnibusPrice", T = "productOmnibusDiscount", t = "productButton";
-var o = /* @__PURE__ */ ((c) => (c.BUTTON = "recommendation-block-button", c.NAME = "recommendation-block-name", c.PRICE = "recommendation-block-price", c.OLD_PRICE = "recommendation-block-old-price", c.OMNIBUS_PRICE = "recommendation-block-omnibus-price", c.OMNIBUS_DISCOUNT = "recommendation-block-omnibus-discount", c.IMAGE = "recommendation-block-image", c))(o || {}), r = /* @__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))(r || {});
+var o = /* @__PURE__ */ ((c) => (c.BUTTON = "recommendation-block-button", c.NAME = "recommendation-block-name", c.PRICE = "recommendation-block-price", c.OLD_PRICE = "recommendation-block-old-price", c.IMAGE = "recommendation-block-image", c))(o || {}), r = /* @__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.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.IMAGE_SIZE = "recommendation-block-image-size-control", c.IMAGE_MARGINS = "recommendation-block-image-margins-control", c))(r || {});
 export {
-  t as ATTR_PRODUCT_BUTTON,
-  _ as ATTR_PRODUCT_IMAGE,
-  b as ATTR_PRODUCT_NAME,
-  i as ATTR_PRODUCT_OLD_PRICE,
-  T as ATTR_PRODUCT_OMNIBUS_DISCOUNT,
-  O as ATTR_PRODUCT_OMNIBUS_PRICE,
-  n as ATTR_PRODUCT_PRICE,
   o as RecommendationBlockId,
   r as RecommendationControlId
 };