@useinsider/guido 3.6.0-beta.859e737 → 3.6.0-beta.dc3a2aa

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

@@ -1,6 +1,6 @@
-var O = Object.defineProperty;
-var p = (o, e, t) => e in o ? O(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
-var r = (o, e, t) => p(o, typeof e != "symbol" ? e + "" : e, t);
+var p = Object.defineProperty;
+var A = (o, e, t) => e in o ? p(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
+var r = (o, e, t) => A(o, typeof e != "symbol" ? e + "" : e, t);
 import { ModificationDescription as h } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { CommonControl as N } from "../../../common-control.js";
 import { ATTR_DATA_CUSTOM_ATTRIBUTES as L } from "../../constants/selectors.js";
@@ -9,9 +9,9 @@ import { DEFAULT_COMPOSITION as _ } from "../../constants/defaultConfig.js";
 import { RecommendationConfigService as s } from "../../services/configService.js";
 import { useRecommendationExtensionStore as f } from "../../store/recommendation.js";
 import { getCurrentLayout as C, getBlockElement as I, regenerateProductRowsWithStyles as S } from "./utils.js";
-const U = "recommendation-layout-orientation-control", A = "recommendationInfoBannerTest", a = {
+const U = "recommendation-layout-orientation-control", O = "recommendationInfoBannerTest", a = {
   LAYOUT: "layout"
-}, y = "data-card-composition", i = {
+}, y = "data-card-composition", n = {
   LAYOUT: "data-layout",
   COLUMN_SPACING: "data-column-spacing",
   ROW_SPACING: "data-row-spacing",
@@ -30,7 +30,7 @@ class Y extends N {
   getTemplate() {
     return `
             <div class="layout-control-container">
-                ${this._GuOnPageMessage({ name: A })}
+                ${this._GuOnPageMessage({ name: O })}
 
                 ${this._GuTwoColumns([
       this._GuLabel({ text: this.api.translate("Layout Orientation") }),
@@ -44,10 +44,11 @@ class Y extends N {
   }
   onRender() {
     this._setInfoMessageValue(
-      A,
+      O,
       this.api.translate(
-        `Note that updating the Layout Orientation, Number of Products and
-                Products in One Row settings resets the style of your Recommendation block.`
+        `Note that updating the Layout Orientation, Number of Products,
+                Products in One Row and Mobile Layout Optimization settings
+                resets the style of your Recommendation block.`
       )
     ), this._setFormValues(), this._listenToFormUpdates();
   }
@@ -83,8 +84,8 @@ class Y extends N {
           },
           `Changed layout to ${t}`
         ), this.store.patchCurrentBlockConfig({ orientation: t });
-        const n = this.api.getDocumentModifier().modifyHtml(c).setAttribute(i.LAYOUT, t).setAttribute(i.COLUMN_SPACING, g.toString()).setAttribute(i.ROW_SPACING, l.toString()).setAttribute(i.MOBILE_COLUMN_SPACING, d.toString()).setAttribute(i.MOBILE_ROW_SPACING, m.toString());
-        t === "list" ? (n.setClass("es-m-p0"), n.setClass("ins-recommendation-list-layout")) : (n.removeClass("es-m-p0"), n.removeClass("ins-recommendation-list-layout")), n.setAttribute(y, _.join(",")).setAttribute(L, "[]"), n.apply(new h(`Update layout to ${t}`)), this._regenerateProductRows(t);
+        const i = this.api.getDocumentModifier().modifyHtml(c).setAttribute(n.LAYOUT, t).setAttribute(n.COLUMN_SPACING, g.toString()).setAttribute(n.ROW_SPACING, l.toString()).setAttribute(n.MOBILE_COLUMN_SPACING, d.toString()).setAttribute(n.MOBILE_ROW_SPACING, m.toString());
+        t === "list" ? (i.setClass("es-m-p0"), i.setClass("ins-recommendation-list-layout")) : (i.removeClass("es-m-p0"), i.removeClass("ins-recommendation-list-layout")), i.setAttribute(y, _.join(",")).setAttribute(L, "[]"), i.apply(new h(`Update layout to ${t}`)), this._regenerateProductRows(t);
       } finally {
         this.isChangingLayout = !1;
       }

package/dist/extensions/Blocks/Recommendation/templates/grid/elementRenderer.js

@@ -1,5 +1,5 @@
 import { RecommendationBlockId as s } from "../../constants/blockIds.js";
-import { ATTR_PRODUCT_ATTR as u, CSS_CLASS_RECO_BUTTON as p, ATTR_PRODUCT_BUTTON as m, ATTR_PRODUCT_OMNIBUS_DISCOUNT as h, ATTR_PRODUCT_OMNIBUS_PRICE as y, ATTR_PRODUCT_OLD_PRICE as T, ATTR_PRODUCT_PRICE as f, ATTR_PRODUCT_NAME as _, ATTR_PRODUCT_IMAGE as x } from "../../constants/selectors.js";
+import { ATTR_PRODUCT_ATTR as u, CSS_CLASS_RECO_BUTTON as p, ATTR_PRODUCT_BUTTON as m, ATTR_PRODUCT_OMNIBUS_DISCOUNT as h, ATTR_PRODUCT_OMNIBUS_PRICE as y, ATTR_PRODUCT_OLD_PRICE as T, ATTR_PRODUCT_PRICE as f, ATTR_PRODUCT_NAME as x, ATTR_PRODUCT_IMAGE as _ } from "../../constants/selectors.js";
 import { useRecommendationExtensionStore as $ } from "../../store/recommendation.js";
 import { formatPrice as C } from "../../utils/priceFormatter.js";
 import { CUSTOM_CELL_HTML as R, sanitizeImageUrl as O } from "../utils.js";
@@ -23,7 +23,7 @@ function i(t, e = "price") {
   });
 }
 const S = {
-  [x]: (t) => `
+  [_]: (t) => `
         <td class="${l}" style="padding: ${a}; height: 100%;" valign="top">
             <table
                 class="product-card-segment"
@@ -51,7 +51,7 @@ const S = {
             </table>
         </td>
     `,
-  [_]: (t) => `
+  [x]: (t) => `
         <td class="${l}" style="padding: ${a}; height: 100%;" valign="middle">
             <table
                 class="product-card-segment"
@@ -115,7 +115,9 @@ const S = {
                             class="esd-block-text product-old-price es-p15l es-p15r"
                             align="center"
                             esd-extension-block-id="${s.OLD_PRICE}">
-                            <p contenteditable="false" style="font-size: 14px; color: #999999;">
+                            <p
+                                contenteditable="false"
+                                style="font-size: 14px; color: #999999; text-decoration: line-through;">
                                 <strong>${i(t, "original_price")}</strong>
                             </p>
                         </td>

package/dist/extensions/Blocks/Recommendation/utils/priceFormatter.js

@@ -1,29 +1,29 @@
-function d(a, t) {
-  const { thousandSeparator: s, decimalSeparator: e, decimalCount: r } = t, u = Math.abs(a).toFixed(r), [c, o] = u.split("."), n = c.replace(
+function $(a, e) {
+  const { thousandSeparator: u, decimalSeparator: t, decimalCount: r } = e, m = Number(Math.abs(a).toPrecision(15)), [c, i = ""] = String(m).split("."), n = i.padEnd(r, "0"), s = c.replace(
     /\B(?=(\d{3})+(?!\d))/g,
-    s
-  ), i = a < 0 ? "-" : "";
-  return r > 0 && o ? `${i}${n}${e}${o}` : `${i}${n}`;
+    u
+  ), o = a < 0 ? "-" : "";
+  return r > 0 && n ? `${o}${s}${t}${n}` : `${o}${s}`;
 }
-function m(a) {
-  const { price: t, currency: s } = a, {
-    symbol: e,
+function d(a) {
+  const { price: e, currency: u } = a, {
+    symbol: t,
     alignment: r,
-    thousandSeparator: u,
+    thousandSeparator: m,
     decimalSeparator: c,
-    decimalCount: o
-  } = s;
-  if (typeof t != "number" || Number.isNaN(t)) {
-    const i = "0".repeat(o), $ = `0${c}${i}`;
-    return r === "before" ? `${e} ${$}` : `${$} ${e}`;
+    decimalCount: i
+  } = u;
+  if (typeof e != "number" || Number.isNaN(e)) {
+    const s = "0".repeat(i), o = `0${c}${s}`;
+    return r === "before" ? `${t} ${o}` : `${o} ${t}`;
   }
-  const n = d(t, {
-    thousandSeparator: u,
+  const n = $(e, {
+    thousandSeparator: m,
     decimalSeparator: c,
-    decimalCount: o
+    decimalCount: i
   });
-  return r === "before" ? `${e} ${n}` : `${n} ${e}`;
+  return r === "before" ? `${t} ${n}` : `${n} ${t}`;
 }
 export {
-  m as formatPrice
+  d as formatPrice
 };

package/dist/src/utils/templatePreparation.d.ts

@@ -1,20 +1,4 @@
 import type { SavedTemplateDetails } from '@@/Types/stripo';
-/**
- * Collects every unsubscribe page id referenced by the unsubscribe blocks
- * present in the email HTML, deduped.
- *
- * The email's unsubscribe link is variation-scoped on the backend, which
- * resolves the page to render from the page ids the FE persists for that
- * variation. Those ids must reflect the blocks actually in the email — not a
- * UI-only selection store — otherwise a block that entered the editor by any
- * path other than the page-selection UI (e.g. a dropped saved module) sends an
- * empty association and the backend falls back to the default page.
- *
- * Read from raw editor HTML: the `data-unsubscribe-page-list` attribute lives
- * on the block node there (the save-time sync-module extractor relies on the
- * same source), so it is reliably present regardless of how the block was added.
- */
-export declare function getHtmlReferencedUnsubscribePages(html: string): number[];
 export declare const useTemplatePreparation: () => {
     prepareTemplateDetails: () => Promise<Omit<SavedTemplateDetails, "metadata">>;
 };

package/dist/utils/templatePreparation.js

@@ -1,58 +1,58 @@
-import { useActionsApi as T } from "../composables/useActionsApi.js";
-import { useHtmlCompiler as D } from "../composables/useHtmlCompiler.js";
-import { DEFAULT_CURRENCY as l, DEFAULT_NODE_CONFIG as a } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
+import { useActionsApi as C } from "../composables/useActionsApi.js";
+import { useHtmlCompiler as T } from "../composables/useHtmlCompiler.js";
+import { DEFAULT_CURRENCY as d, DEFAULT_NODE_CONFIG as s } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
 import { useRecommendationExtensionStore as b } from "../extensions/Blocks/Recommendation/store/recommendation.js";
-import { DATA_ATTRIBUTES as h } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
-import { parsePageList as P } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
-import { useDynamicContentStore as w } from "../stores/dynamic-content.js";
-import { useUnsubscribeStore as E } from "../stores/unsubscribe.js";
-function U(c) {
-  const n = new DOMParser().parseFromString(c, "text/html").querySelectorAll(`[${h.PAGE_LIST}]`), t = [];
-  return n.forEach((s) => {
-    const r = s.getAttribute(h.PAGE_LIST);
-    r && t.push(...P(r));
-  }), [...new Set(t)];
+import { DATA_ATTRIBUTES as S } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
+import { parsePageList as D } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
+import { useDynamicContentStore as P } from "../stores/dynamic-content.js";
+import { useUnsubscribeStore as w } from "../stores/unsubscribe.js";
+function E(i, o) {
+  const t = new DOMParser().parseFromString(i, "text/html").querySelectorAll(`[${S.PAGE_LIST}]`), c = [];
+  return t.forEach((r) => {
+    const a = r.getAttribute(S.PAGE_LIST);
+    a && c.push(...D(a));
+  }), o.filter((r) => c.includes(r));
 }
-async function F(c) {
-  const i = new DOMParser().parseFromString(c, "text/html").querySelectorAll(".recommendation-block-v2");
-  if (i.length === 0)
+async function U(i) {
+  const m = new DOMParser().parseFromString(i, "text/html").querySelectorAll(".recommendation-block-v2");
+  if (m.length === 0)
     return;
-  const n = b();
-  i.forEach((t) => {
-    var p, g, f, o, y;
-    const s = t.getAttribute("recommendation-id"), r = s ? Number(s) : NaN;
+  const l = b();
+  m.forEach((t) => {
+    var g, f, u, n, y;
+    const c = t.getAttribute("recommendation-id"), r = c ? Number(c) : NaN;
     if (!Number.isFinite(r))
       return;
-    const d = t.getAttribute("esd-ext-config");
-    if (!d)
+    const a = t.getAttribute("esd-ext-config");
+    if (!a)
       return;
     let e;
     try {
-      e = JSON.parse(d);
+      e = JSON.parse(a);
     } catch {
       return;
     }
     if (!e || typeof e != "object" || Array.isArray(e))
       return;
-    const m = {
-      strategy: e.strategy ?? a.strategy,
-      language: e.language ?? a.language,
-      size: e.size ?? a.size,
+    const p = {
+      strategy: e.strategy ?? s.strategy,
+      language: e.language ?? s.language,
+      size: e.size ?? s.size,
       // Spread the default arrays so each block gets a fresh reference
       // instead of sharing the singleton in DEFAULT_NODE_CONFIG.
-      productIds: e.productIds ?? [...a.productIds],
-      filters: e.filters ?? [...a.filters],
-      shuffleProducts: e.shuffleProducts ?? a.shuffleProducts,
-      currencyCode: ((p = e.currency) == null ? void 0 : p.code) ?? l.code,
-      currencyAlignment: ((g = e.currency) == null ? void 0 : g.alignment) ?? l.alignment,
-      currencyDecimalCount: ((f = e.currency) == null ? void 0 : f.decimalCount) ?? l.decimalCount,
-      currencyDecimalSeparator: ((o = e.currency) == null ? void 0 : o.decimalSeparator) ?? l.decimalSeparator,
-      currencyThousandSeparator: ((y = e.currency) == null ? void 0 : y.thousandSeparator) ?? l.thousandSeparator
+      productIds: e.productIds ?? [...s.productIds],
+      filters: e.filters ?? [...s.filters],
+      shuffleProducts: e.shuffleProducts ?? s.shuffleProducts,
+      currencyCode: ((g = e.currency) == null ? void 0 : g.code) ?? d.code,
+      currencyAlignment: ((f = e.currency) == null ? void 0 : f.alignment) ?? d.alignment,
+      currencyDecimalCount: ((u = e.currency) == null ? void 0 : u.decimalCount) ?? d.decimalCount,
+      currencyDecimalSeparator: ((n = e.currency) == null ? void 0 : n.decimalSeparator) ?? d.decimalSeparator,
+      currencyThousandSeparator: ((y = e.currency) == null ? void 0 : y.thousandSeparator) ?? d.thousandSeparator
     };
-    n.seedBlockUrlConfig(r, m);
+    l.seedBlockUrlConfig(r, p);
   });
   try {
-    await n.fetchRecommendationCreateData();
+    await l.fetchRecommendationCreateData();
   } catch (t) {
     console.warn(
       "Recommendation reference data pre-load failed; validator will skip the availability check.",
@@ -60,43 +60,42 @@ async function F(c) {
     );
   }
 }
-const k = () => {
-  const c = w(), u = E(), { getCompiledEmail: i, getTemplateData: n } = T(), { compileHtml: t } = D();
+const _ = () => {
+  const i = P(), o = w(), { getCompiledEmail: m, getTemplateData: l } = C(), { compileHtml: t } = T();
   return {
     prepareTemplateDetails: async () => {
-      const { html: r, ampHtml: d = "", ampErrors: e = [] } = await i({
+      const { html: r, ampHtml: a = "", ampErrors: e = [] } = await m({
         minimize: !0,
         resetDataSavedFlag: !1
-      }), { html: m, css: p, syncModulesIds: g = [] } = await n();
-      u.selectedUnsubscribePages.length && await u.fetchTemplates(), await F(m);
-      const { compiledHtml: f, stats: o, appliedRules: y } = t(r), A = c.getSelectedDynamicContentList, C = b(), S = U(m);
+      }), { html: p, css: g, syncModulesIds: f = [] } = await l();
+      o.selectedUnsubscribePages.length && await o.fetchTemplates(), await U(p);
+      const { compiledHtml: u, stats: n, appliedRules: y } = t(r), h = i.getSelectedDynamicContentList, A = b();
       return console.debug("HTML Compilation Stats:", {
-        originalSize: o.originalSize,
-        compiledSize: o.compiledSize,
-        reduction: `${o.reductionPercentage.toFixed(2)}%`,
+        originalSize: n.originalSize,
+        compiledSize: n.compiledSize,
+        reduction: `${n.reductionPercentage.toFixed(2)}%`,
         appliedRules: y,
-        executionTime: `${o.executionTime.toFixed(2)}ms`
+        executionTime: `${n.executionTime.toFixed(2)}ms`
       }), {
-        dynamicContentList: A,
-        compiledHtml: f,
-        rawHtml: m,
-        css: p,
-        ampHtml: d,
+        dynamicContentList: h,
+        compiledHtml: u,
+        rawHtml: p,
+        css: g,
+        ampHtml: a,
         ampErrors: e,
-        modules: g.map(Number),
+        modules: f.map(Number),
         recommendation: {
-          campaignUrls: C.recommendationCampaignUrls,
+          campaignUrls: A.recommendationCampaignUrls,
           configs: {}
         },
         unsubscribe: {
-          status: S.length > 0,
-          config: S
+          status: o.unsubscribePagesStatus,
+          config: E(u, o.selectedUnsubscribePages)
         }
       };
     }
   };
 };
 export {
-  U as getHtmlReferencedUnsubscribePages,
-  k as useTemplatePreparation
+  _ as useTemplatePreparation
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.6.0-beta.859e737",
+  "version": "3.6.0-beta.dc3a2aa",
   "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",