@useinsider/guido 3.6.0-beta.4f2bf14 → 3.6.0-beta.7ca3ec5

package/dist/composables/useStripoEventHandler.js

@@ -1,35 +1,33 @@
-import { useStripoApi as c } from "../services/stripoApi.js";
+import { useStripoApi as i } from "../services/stripoApi.js";
 import { useEditorStore as u } from "../stores/editor.js";
 import { useOnboardingStore as l } from "../stores/onboarding.js";
 import { useUnsubscribeStore as b } from "../stores/unsubscribe.js";
 const v = () => {
-  const { updateSyncModule: r, getSyncModule: a } = c(), t = u(), s = b(), i = {
+  const { updateSyncModule: d, getSyncModule: r } = i(), n = u(), s = b(), a = {
     block_dropped: ({ blockName: e }) => {
       if (e === "BLOCK_TEXT") {
-        const o = l(), n = !o.shouldShowOnboarding("textBlockOnboarding"), d = o.isActive("textBlockOnboarding");
-        if (n || d)
+        const o = l(), t = !o.shouldShowOnboarding("textBlockOnboarding"), c = o.isActive("textBlockOnboarding");
+        if (t || c)
           return;
         o.start("textBlockOnboarding");
       }
     },
     module_saved: async (e) => {
-      t.syncModulesEnabled && (console.debug("[module_saved] Saved module data:", e), await r(e));
+      n.syncModulesEnabled && (console.debug("[module_saved] Saved module data:", e), await d(e));
     },
     module_dropped: async (e) => {
-      if (!t.syncModulesEnabled)
+      if (!n.syncModulesEnabled)
         return;
-      const { moduleId: o } = e, n = await a(o);
-      console.debug("[module_dropped] Sync module data:", n), n.unsubscriptionPreferencePages.length && (await s.fetchTemplates(), s.addUnsubscribePages(
-        n.unsubscriptionPreferencePages.map((d) => d.id)
-      ));
+      const { moduleId: o } = e, t = await r(o);
+      console.debug("[module_dropped] Sync module data:", t), t.unsubscriptionPreferencePages.length && await s.fetchTemplates();
     },
     module_updated: async (e) => {
-      t.syncModulesEnabled && (console.debug("[module_updated] Updated module data:", e), await r(e));
+      n.syncModulesEnabled && (console.debug("[module_updated] Updated module data:", e), await d(e));
     }
   };
   return { handleEvent: async (e, o) => {
-    const n = i[e];
-    console.debug("Stripo Event: ", e, o), n && await n(o);
+    const t = a[e];
+    console.debug("Stripo Event: ", e, o), t && await t(o);
   } };
 };
 export {

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

@@ -1,31 +1,31 @@
-var f = Object.defineProperty;
-var p = (d, l, t) => l in d ? f(d, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[l] = t;
-var s = (d, l, t) => p(d, typeof l != "symbol" ? l + "" : l, t);
+var C = Object.defineProperty;
+var p = (d, c, t) => c in d ? C(d, c, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[c] = t;
+var s = (d, c, t) => p(d, typeof c != "symbol" ? c + "" : c, t);
 import { CommonControl as g } from "../../../common-control.js";
 import { DEFAULT_NODE_CONFIG as a } from "../../constants/defaultConfig.js";
 import { RecommendationConfigService as h } from "../../services/configService.js";
 import { useRecommendationExtensionStore as y } from "../../store/recommendation.js";
-import { AlgorithmControl as R } from "./algorithm.js";
-import { ALGORITHM_CONTROL_ID as J } from "./algorithm.js";
-import { CurrencyControl as N } from "./currency.js";
-import { CURRENCY_CONTROL_ID as X } from "./currency.js";
+import { AlgorithmControl as N } from "./algorithm.js";
+import { ALGORITHM_CONTROL_ID as Q } from "./algorithm.js";
+import { CurrencyControl as R } from "./currency.js";
+import { CURRENCY_CONTROL_ID as Z } from "./currency.js";
 import { FiltersControl as _ } from "./filters.js";
-import { FILTERS_CONTROL_ID as tt } from "./filters.js";
+import { FILTERS_CONTROL_ID as et } from "./filters.js";
 import { LayoutOrientationControl as b } from "./layoutOrientation.js";
-import { LAYOUT_ORIENTATION_CONTROL_ID as ot } from "./layoutOrientation.js";
+import { LAYOUT_ORIENTATION_CONTROL_ID as rt } from "./layoutOrientation.js";
 import { LocaleControl as O } from "./locale.js";
-import { LOCALE_CONTROL_ID as nt } from "./locale.js";
+import { LOCALE_CONTROL_ID as it } from "./locale.js";
 import { ProductCountControl as I } from "./productCount.js";
-import { PRODUCT_COUNT_CONTROL_ID as st } from "./productCount.js";
+import { PRODUCT_COUNT_CONTROL_ID as at } from "./productCount.js";
 import { ProductLayoutControl as T } from "./productLayout.js";
 import { PRODUCT_LAYOUT_CONTROL_ID as lt } from "./productLayout.js";
 import { ShuffleControl as S } from "./shuffle.js";
-import { SHUFFLE_CONTROL_ID as ut } from "./shuffle.js";
-import { getBlockElement as L, updateProductContentInPlace as P, regenerateProductRowsWithStyles as D } from "./utils.js";
-import { adjustProductsToSize as ht, formatProductPrice as mt, getCardComposition as Ct, getCurrentLayout as ft, reapplySpacing as pt, regenerateMobileProductRows as gt, regenerateProductRows as yt, setCurrencyAttributes as Rt, updatePricesInPlace as Nt, updateSingleProductContent as _t } from "./utils.js";
+import { SHUFFLE_CONTROL_ID as dt } from "./shuffle.js";
+import { setCurrencyAttributes as L, getBlockElement as P, updateProductContentInPlace as D, regenerateProductRowsWithStyles as k } from "./utils.js";
+import { adjustProductsToSize as mt, formatProductPrice as ft, getCardComposition as Ct, getCurrentLayout as pt, reapplySpacing as gt, regenerateMobileProductRows as yt, regenerateProductRows as Nt, updatePricesInPlace as Rt, updateSingleProductContent as _t } from "./utils.js";
 import { useDebounceFn as m } from "../../../../../node_modules/@vueuse/shared/index.js";
-const k = "recommendation-id", E = "ui-elements-recommendation-block";
-class H extends g {
+const E = "recommendation-id", v = "ui-elements-recommendation-block";
+class K extends g {
   constructor() {
     super(...arguments);
     s(this, "store", y());
@@ -62,11 +62,11 @@ class H extends g {
       if (!this.currentNode || !this.api)
         return;
       const e = this.api.getDocumentModifier();
-      P({
+      D({
         currentNode: this.currentNode,
         documentModifier: e,
         products: t
-      }) || D({
+      }) || k({
         currentNode: this.currentNode,
         documentModifier: e,
         products: t
@@ -74,10 +74,10 @@ class H extends g {
     }, 100));
   }
   getId() {
-    return E;
+    return v;
   }
   getTemplate() {
-    return this.algorithmControl = new R(), this.localeControl = new O(), this.currencyControl = new N(), this.productCountControl = new I(), this.productLayoutControl = new T(), this.filtersControl = new _(), this.shuffleControl = new S(), this.layoutOrientationControl = new b(), [
+    return this.algorithmControl = new N(), this.localeControl = new O(), this.currencyControl = new R(), this.productCountControl = new I(), this.productLayoutControl = new T(), this.filtersControl = new _(), this.shuffleControl = new S(), this.layoutOrientationControl = new b(), [
       this.algorithmControl,
       this.localeControl,
       this.currencyControl,
@@ -263,7 +263,11 @@ class H extends g {
       this.currentNode,
       e,
       "Applied smart defaults"
-    ), this.store.patchCurrentBlockConfig({
+    ), o && e.currency && L({
+      currentNode: this.currentNode,
+      documentModifier: this.api.getDocumentModifier(),
+      currency: e.currency
+    }), this.store.patchCurrentBlockConfig({
       ...o ? {
         currencySettings: {
           name: o,
@@ -283,10 +287,10 @@ class H extends g {
    * Reads the recommendation-id attribute from the block element within the node
    */
   _getRecommendationIdFromNode(t) {
-    const e = L(t);
+    const e = P(t);
     if (!e || !("getAttribute" in e))
       return null;
-    const o = e.getAttribute(k);
+    const o = e.getAttribute(E);
     if (!o)
       return null;
     const r = parseInt(o);
@@ -316,8 +320,8 @@ class H extends g {
       }
       const i = t.$state.configVersion;
       i !== o && (o = i, this._persistFiltersToNodeConfig(), this._debouncedFetchProducts());
-      const c = t.recommendationProducts, u = c !== e, C = Array.isArray(c) && c.length > 0;
-      u && C && (e = c, this._debouncedRegenerateWithProducts());
+      const l = t.recommendationProducts, u = l !== e, f = Array.isArray(l) && l.length > 0;
+      u && f && (e = l, this._debouncedRegenerateWithProducts());
     });
   }
   /**
@@ -337,35 +341,35 @@ class H extends g {
   }
 }
 export {
-  J as ALGORITHM_CONTROL_ID,
-  R as AlgorithmControl,
-  E as CONTROL_BLOCK_ID,
-  X as CURRENCY_CONTROL_ID,
-  N as CurrencyControl,
-  tt as FILTERS_CONTROL_ID,
+  Q as ALGORITHM_CONTROL_ID,
+  N as AlgorithmControl,
+  v as CONTROL_BLOCK_ID,
+  Z as CURRENCY_CONTROL_ID,
+  R as CurrencyControl,
+  et as FILTERS_CONTROL_ID,
   _ as FiltersControl,
-  ot as LAYOUT_ORIENTATION_CONTROL_ID,
-  nt as LOCALE_CONTROL_ID,
+  rt as LAYOUT_ORIENTATION_CONTROL_ID,
+  it as LOCALE_CONTROL_ID,
   b as LayoutOrientationControl,
   O as LocaleControl,
-  st as PRODUCT_COUNT_CONTROL_ID,
+  at as PRODUCT_COUNT_CONTROL_ID,
   lt as PRODUCT_LAYOUT_CONTROL_ID,
   I as ProductCountControl,
   T as ProductLayoutControl,
-  H as RecommendationBlockControl,
-  ut as SHUFFLE_CONTROL_ID,
+  K as RecommendationBlockControl,
+  dt as SHUFFLE_CONTROL_ID,
   S as ShuffleControl,
-  ht as adjustProductsToSize,
-  mt as formatProductPrice,
-  L as getBlockElement,
+  mt as adjustProductsToSize,
+  ft as formatProductPrice,
+  P as getBlockElement,
   Ct as getCardComposition,
-  ft as getCurrentLayout,
-  pt as reapplySpacing,
-  gt as regenerateMobileProductRows,
-  yt as regenerateProductRows,
-  D as regenerateProductRowsWithStyles,
-  Rt as setCurrencyAttributes,
-  Nt as updatePricesInPlace,
-  P as updateProductContentInPlace,
+  pt as getCurrentLayout,
+  gt as reapplySpacing,
+  yt as regenerateMobileProductRows,
+  Nt as regenerateProductRows,
+  k as regenerateProductRowsWithStyles,
+  L as setCurrencyAttributes,
+  Rt as updatePricesInPlace,
+  D as updateProductContentInPlace,
   _t as updateSingleProductContent
 };

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/controls/main/utils.js

@@ -1,6 +1,6 @@
 import { ModificationDescription as p } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { RecommendationBlockId as m } from "../../constants/blockIds.js";
-import { MOBILE_CONTAINER_SELECTOR as q, MOBILE_ROW_SELECTOR as k, CURRENCY_ATTR as y, DESKTOP_CONTAINER_SELECTOR as P, CONTAINER_SELECTOR as v, ATTR_PRODUCT_ATTR as W } from "../../constants/selectors.js";
+import { CURRENCY_ATTR as y, MOBILE_CONTAINER_SELECTOR as q, MOBILE_ROW_SELECTOR as k, DESKTOP_CONTAINER_SELECTOR as P, CONTAINER_SELECTOR as v, ATTR_PRODUCT_ATTR as W } from "../../constants/selectors.js";
 import { RecommendationConfigService as E } from "../../services/configService.js";
 import { useRecommendationExtensionStore as C } from "../../store/recommendation.js";
 import { prepareProductRows as _ } from "../../templates/index.js";

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

@@ -115,8 +115,10 @@ 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;">
-                                <strong>${i(t, "original_price")}</strong>
+                            <p
+                                contenteditable="false"
+                                style="font-size: 14px; color: #999999;">
+                                <s><strong>${i(t, "original_price")}</strong></s>
                             </p>
                         </td>
                     </tr>

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

@@ -14,10 +14,10 @@ function b() {
     thousandSeparator: e.thousandSeparator
   };
 }
-function s(t, e = "price") {
-  const n = b(), a = t[e], r = (a == null ? void 0 : a[n.code]) ?? Object.values(a ?? {})[0] ?? 0;
+function r(t, e = "price") {
+  const n = b(), s = t[e], a = (s == null ? void 0 : s[n.code]) ?? Object.values(s ?? {})[0] ?? 0;
   return R({
-    price: r,
+    price: a,
     currency: n
   });
 }
@@ -69,7 +69,7 @@ const I = {
                 esd-extension-block-id="${o.PRICE}"
                 align="left">
                 <p contenteditable="false" style="font-size: 16px; color: #333333; font-weight: bold; margin: 0;">
-                    <strong>${s(t, "price")}</strong>
+                    <strong>${r(t, "price")}</strong>
                 </p>
             </td>
         </tr>
@@ -85,8 +85,8 @@ const I = {
                 align="left">
                 <p
                     contenteditable="false"
-                    style="font-size: 14px; color: #999999; text-decoration: line-through; margin: 0;">
-                    <strong>${s(t, "original_price")}</strong>
+                    style="font-size: 14px; color: #999999; margin: 0;">
+                    <s><strong>${r(t, "original_price")}</strong></s>
                 </p>
             </td>
         </tr>
@@ -104,7 +104,7 @@ const I = {
                 align="left">
                 <p contenteditable="false" style="font-size: 12px; color: #666666; margin: 0;">
                     <span class="omnibus-text-before">Lowest 30-day price: </span>
-                    <span class="omnibus-price-value">${s(t, "original_price")}</span>
+                    <span class="omnibus-price-value">${r(t, "original_price")}</span>
                     <span class="omnibus-text-after"></span>
                 </p>
             </td>
@@ -115,7 +115,7 @@ const I = {
    */
   [g]: (t) => {
     var i, l;
-    const e = b(), n = ((i = t.original_price) == null ? void 0 : i[e.code]) ?? Object.values(t.original_price ?? {})[0] ?? 0, a = ((l = t.price) == null ? void 0 : l[e.code]) ?? Object.values(t.price ?? {})[0] ?? 0, r = n > 0 ? Math.round((n - a) / n * 100) : 0, m = r > 0 ? `-${r}%` : "0%";
+    const e = b(), n = ((i = t.original_price) == null ? void 0 : i[e.code]) ?? Object.values(t.original_price ?? {})[0] ?? 0, s = ((l = t.price) == null ? void 0 : l[e.code]) ?? Object.values(t.price ?? {})[0] ?? 0, a = n > 0 ? Math.round((n - s) / n * 100) : 0, m = a > 0 ? `-${a}%` : "0%";
     return `
         <tr>
             <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 d(c, t) {
+  const { thousandSeparator: i, decimalSeparator: e, decimalCount: r } = t, [u, o = ""] = String(c).split("."), n = o.slice(0, r).padEnd(r, "0"), a = u.replace(
     /\B(?=(\d{3})+(?!\d))/g,
-    s
-  ), i = a < 0 ? "-" : "";
-  return r > 0 && o ? `${i}${n}${e}${o}` : `${i}${n}`;
+    i
+  );
+  return r > 0 && n ? `${a}${e}${n}` : a;
 }
-function m(a) {
-  const { price: t, currency: s } = a, {
+function f(c) {
+  const { price: t, currency: i } = c, {
     symbol: e,
     alignment: r,
     thousandSeparator: u,
-    decimalSeparator: c,
-    decimalCount: o
-  } = s;
+    decimalSeparator: o,
+    decimalCount: n
+  } = i;
   if (typeof t != "number" || Number.isNaN(t)) {
-    const i = "0".repeat(o), $ = `0${c}${i}`;
-    return r === "before" ? `${e} ${$}` : `${$} ${e}`;
+    const s = "0".repeat(n), m = `0${o}${s}`;
+    return r === "before" ? `${e} ${m}` : `${m} ${e}`;
   }
-  const n = d(t, {
+  const a = d(t, {
     thousandSeparator: u,
-    decimalSeparator: c,
-    decimalCount: o
+    decimalSeparator: o,
+    decimalCount: n
   });
-  return r === "before" ? `${e} ${n}` : `${n} ${e}`;
+  return r === "before" ? `${e} ${a}` : `${a} ${e}`;
 }
 export {
-  m as formatPrice
+  f as formatPrice
 };

package/package.json

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