@useinsider/guido 3.1.1-beta.23117ce → 3.1.1-beta.240b117

package/dist/components/Guido.vue.js

@@ -3,7 +3,7 @@ import i from "./Guido.vue2.js";
 import a from "../_virtual/_plugin-vue2_normalizer.js";
 var t = function() {
   var o = this, r = o._self._c, e = o._self._setupProxy;
-  return r("div", { staticClass: "guido-editor__wrapper", class: { "guido-editor__no-header": e.noHeader } }, [r(e.HeaderWrapper, { ref: "headerWrapperRef" }), e.editorStore.isPreviewModeOpen ? r(e.PreviewContainer) : o._e(), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.previewStore.isLoaded, expression: "!previewStore.isLoaded" }], staticClass: "guido-editor__container", class: { "guido-editor__no-header": e.noHeader }, attrs: { id: "guido-editor" } }), r(e.Toaster), r(e.FilterSelectionDrawer), r(e.SaveAsTemplateDrawer), e.isTestPartner() ? o._e() : r(e.OnboardingWrapper, { on: { "onboarding-finished": function(_) {
+  return r("div", { ref: "wrapperRef", staticClass: "guido-editor__wrapper", class: { "guido-editor__no-header": e.noHeader } }, [r(e.HeaderWrapper, { ref: "headerWrapperRef" }), e.editorStore.isPreviewModeOpen ? r(e.PreviewContainer) : o._e(), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.previewStore.isLoaded, expression: "!previewStore.isLoaded" }], staticClass: "guido-editor__container", class: { "guido-editor__no-header": e.noHeader }, attrs: { id: "guido-editor" } }), r(e.Toaster), r(e.FilterSelectionDrawer), r(e.SaveAsTemplateDrawer), e.isTestPartner() ? o._e() : r(e.OnboardingWrapper, { on: { "onboarding-finished": function(p) {
     return e.emit("onboarding:finished");
   } } }), r(e.UnsubscribeWrapper), r(e.LoadingWrapper)], 1);
 }, n = [], s = /* @__PURE__ */ a(
@@ -12,9 +12,9 @@ var t = function() {
   n,
   !1,
   null,
-  "a26d7792"
+  "25780af6"
 );
-const v = s.exports;
+const u = s.exports;
 export {
-  v as default
+  u as default
 };

package/dist/components/Guido.vue2.js

@@ -1,121 +1,131 @@
-import { defineComponent as K, defineAsyncComponent as _, ref as V, computed as P, watch as j, onMounted as q, onUnmounted as J } from "vue";
-import { provideGuidoActions as Q } from "../composables/useGuidoActions.js";
-import { usePartner as X } from "../composables/usePartner.js";
-import { useStripo as Y } from "../composables/useStripo.js";
-import { useTimerClone as Z } from "../composables/useTimerClone.js";
-import { migrate as A } from "../config/migrator/index.js";
-import { ModuleFolderDefaults as N } from "../enums/defaults.js";
-import $ from "./organisms/base/Toaster.vue.js";
-import ee from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
-import oe from "./organisms/header/HeaderWrapper.vue.js";
-import te from "./organisms/LoadingWrapper.vue.js";
-import ne from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
-import se from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
-import { useStripoApi as re } from "../services/stripoApi.js";
-import { useConfigStore as ce } from "../stores/config.js";
-import { useDynamicContentStore as ae } from "../stores/dynamic-content.js";
-import { useEditorStore as ie } from "../stores/editor.js";
-import { usePreviewStore as me } from "../stores/preview.js";
-import { useUnsubscribeStore as de } from "../stores/unsubscribe.js";
-const Me = /* @__PURE__ */ K({
+import { defineComponent as j, defineAsyncComponent as R, ref as A, computed as I, watch as J, onMounted as Q, onUnmounted as X } from "vue";
+import { provideGuidoActions as Y } from "../composables/useGuidoActions.js";
+import { usePartner as Z } from "../composables/usePartner.js";
+import { useStripo as ee } from "../composables/useStripo.js";
+import { useTimerClone as te } from "../composables/useTimerClone.js";
+import { migrate as W } from "../config/migrator/index.js";
+import { ModuleFolderDefaults as B } from "../enums/defaults.js";
+import { RIBBON_SELECTOR as oe } from "../enums/onboarding.js";
+import ne from "./organisms/base/Toaster.vue.js";
+import se from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
+import re from "./organisms/header/HeaderWrapper.vue.js";
+import ce from "./organisms/LoadingWrapper.vue.js";
+import ae from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
+import ie from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
+import { useStripoApi as me } from "../services/stripoApi.js";
+import { useConfigStore as de } from "../stores/config.js";
+import { useDynamicContentStore as le } from "../stores/dynamic-content.js";
+import { useEditorStore as ue } from "../stores/editor.js";
+import { usePreviewStore as pe } from "../stores/preview.js";
+import { useUnsubscribeStore as fe } from "../stores/unsubscribe.js";
+const Re = /* @__PURE__ */ j({
   __name: "Guido",
   props: {
     config: null
   },
   emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change", "ready", "onboarding:finished", "test-email:click"],
-  setup(W, { expose: I, emit: t }) {
-    const v = W, O = _(
+  setup(H, { expose: x, emit: s }) {
+    const b = H, G = R(
       () => import("./organisms/email-preview/PreviewContainer.vue.js")
-    ), G = _(
+    ), z = R(
       () => import("./organisms/onboarding/OnboardingWrapper.vue.js")
-    ), h = V(), i = ae(), y = de(), s = ce();
-    s.init(v.config);
-    const m = ie(), H = me(), c = P(() => m.hasChanges), { isTestPartner: x } = X(), f = () => {
+    ), S = A(), d = A(), l = le(), g = fe(), a = de();
+    a.init(b.config);
+    const u = ue(), q = pe(), i = I(() => u.hasChanges), { isTestPartner: K } = Z(), w = () => {
       var e;
-      return (e = h.value) == null ? void 0 : e.handleSave(!0);
+      return (e = S.value) == null ? void 0 : e.handleSave(!0);
     }, {
-      templateId: d,
-      userId: b,
-      partnerName: S,
-      username: g,
-      template: o,
-      editor: n
-    } = s, a = (o == null ? void 0 : o.html) || "", D = (o == null ? void 0 : o.css) || "", l = (o == null ? void 0 : o.preselectedDynamicContent) || [], w = (n == null ? void 0 : n.savedModulesFolderName) || N.SAVED_MODULES, E = (n == null ? void 0 : n.defaultModulesFolderName) || N.DEFAULT_MODULES;
-    m.templateId = d;
-    const u = {
-      emailId: d,
-      userId: b,
-      username: g,
-      partnerName: S,
-      savedModulesFolderName: w,
-      defaultModulesFolderName: E
-    }, C = {
-      preselectedDynamicContentList: l,
+      templateId: p,
+      userId: E,
+      partnerName: D,
+      username: C,
+      template: t,
+      editor: r
+    } = a, m = (t == null ? void 0 : t.html) || "", T = (t == null ? void 0 : t.css) || "", f = (t == null ? void 0 : t.preselectedDynamicContent) || [], k = (r == null ? void 0 : r.savedModulesFolderName) || B.SAVED_MODULES, F = (r == null ? void 0 : r.defaultModulesFolderName) || B.DEFAULT_MODULES;
+    u.templateId = p;
+    const v = {
+      emailId: p,
+      userId: E,
+      username: C,
+      partnerName: D,
+      savedModulesFolderName: k,
+      defaultModulesFolderName: F
+    }, L = {
+      preselectedDynamicContentList: f,
       onReady: () => {
-        console.debug("guido:ready"), t("ready");
+        console.debug("guido:ready"), s("ready");
       }
-    }, { initPlugin: T } = Y(u, C), { getDefaultTemplate: k } = re(), { cloneTimersOnSave: F, hasTimerBlocks: U } = Z(), B = P(() => {
+    }, { initPlugin: U } = ee(v, L), { getDefaultTemplate: _ } = me(), { cloneTimersOnSave: M, hasTimerBlocks: O } = te(), V = I(() => {
       var e;
-      return !((e = s.ui) != null && e.showHeader);
+      return !((e = a.ui) != null && e.showHeader);
     });
-    Q({
+    Y({
       onBack: () => {
-        console.debug("guido:back"), t("back");
+        console.debug("guido:back"), s("back");
       },
       onSaveStart: () => {
-        console.debug("guido:save:start"), t("save:start");
+        console.debug("guido:save:start"), s("save:start");
       },
       onSaveComplete: (e) => {
-        const r = { ...e, metadata: u };
-        console.debug("guido:save:complete", r), t("save:complete", r);
+        const n = { ...e, metadata: v };
+        console.debug("guido:save:complete", n), s("save:complete", n);
       },
       onTestEmailClick: () => {
-        console.debug("guido:test-email:click"), t("test-email:click");
+        console.debug("guido:test-email:click"), s("test-email:click");
       }
     });
-    const L = (e) => {
-      console.debug("dynamic-content:close", e), i.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
-    }, M = () => {
+    const P = (e) => {
+      console.debug("dynamic-content:close", e), l.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
+    }, N = () => {
       console.debug("dynamic-content:close", "Without Data"), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: { text: "", value: "" } }));
     };
-    j(() => c.value, () => {
-      t("on-change", c.value);
+    J(() => i.value, () => {
+      s("on-change", i.value);
     });
-    const p = (e) => {
-      const r = e, { attribute: R, position: z } = r.detail;
-      console.debug("dynamic-content:open", r.detail), t("dynamic-content:open", R, z);
+    const y = (e) => {
+      const n = e, { attribute: o, position: $ } = n.detail;
+      console.debug("dynamic-content:open", n.detail), s("dynamic-content:open", o, $);
     };
-    return q(async () => {
-      console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow");
+    let c = null;
+    const h = () => {
+      var n;
+      const e = document.querySelector(oe);
+      (n = d.value) == null || n.style.setProperty("--ribbon-offset", `${(e == null ? void 0 : e.offsetHeight) ?? 0}px`);
+    };
+    return Q(async () => {
+      var n;
+      console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow"), h();
+      const e = (n = d.value) == null ? void 0 : n.parentElement;
+      e && (c = new ResizeObserver(h), c.observe(e));
       try {
-        y.selectedUnsubscribePages = (o == null ? void 0 : o.selectedUnsubscribePages) || [];
-        let e = {
-          html: a && await A(a),
-          css: D
+        g.selectedUnsubscribePages = (t == null ? void 0 : t.selectedUnsubscribePages) || [];
+        let o = {
+          html: m && await W(m),
+          css: T
         };
-        e.html || (e = await k(), e.html = await A(e.html)), U(e.html) && (e.html = await F(e.html)), await T(e), i.selectedDynamicContentList = l;
-      } catch (e) {
-        console.error("Failed to initialize Stripo editor:", e);
+        o.html || (o = await _(), o.html = await W(o.html)), O(o.html) && (o.html = await M(o.html)), await U(o), l.selectedDynamicContentList = f;
+      } catch (o) {
+        console.error("Failed to initialize Stripo editor:", o);
       }
-      document.addEventListener("dynamic-content:open", p);
-    }), J(() => {
-      document.removeEventListener("dynamic-content:open", p);
+      document.addEventListener("dynamic-content:open", y);
+    }), X(() => {
+      c == null || c.disconnect(), document.removeEventListener("dynamic-content:open", y);
       try {
         window.UIEditor.removeEditor();
       } catch {
         console.debug("Failed to remove Stripo editor: No editor found");
       }
-      s.reset();
-    }), I({
+      a.reset();
+    }), x({
       dynamicContent: {
-        insert: L,
-        close: M
+        insert: P,
+        close: N
       },
-      hasChanges: c,
-      saveSilent: f
-    }), { __sfc: !0, PreviewContainer: O, OnboardingWrapper: G, headerWrapperRef: h, dynamicContentStore: i, unsubscribeStore: y, props: v, configStore: s, editorStore: m, previewStore: H, hasChanges: c, isTestPartner: x, saveSilent: f, templateId: d, userId: b, partnerName: S, username: g, templateConfig: o, editorConfig: n, html: a, css: D, preselectedDynamicContentList: l, savedModulesFolderName: w, defaultModulesFolderName: E, emit: t, metadata: u, options: C, initPlugin: T, getDefaultTemplate: k, cloneTimersOnSave: F, hasTimerBlocks: U, noHeader: B, insertDynamicContent: L, closeDynamicContent: M, handleDynamicContentOpen: p, Toaster: $, FilterSelectionDrawer: ee, HeaderWrapper: oe, LoadingWrapper: te, SaveAsTemplateDrawer: ne, UnsubscribeWrapper: se };
+      hasChanges: i,
+      saveSilent: w
+    }), { __sfc: !0, PreviewContainer: G, OnboardingWrapper: z, headerWrapperRef: S, wrapperRef: d, dynamicContentStore: l, unsubscribeStore: g, props: b, configStore: a, editorStore: u, previewStore: q, hasChanges: i, isTestPartner: K, saveSilent: w, templateId: p, userId: E, partnerName: D, username: C, templateConfig: t, editorConfig: r, html: m, css: T, preselectedDynamicContentList: f, savedModulesFolderName: k, defaultModulesFolderName: F, emit: s, metadata: v, options: L, initPlugin: U, getDefaultTemplate: _, cloneTimersOnSave: M, hasTimerBlocks: O, noHeader: V, insertDynamicContent: P, closeDynamicContent: N, handleDynamicContentOpen: y, ribbonObserver: c, updateRibbonOffset: h, Toaster: ne, FilterSelectionDrawer: se, HeaderWrapper: re, LoadingWrapper: ce, SaveAsTemplateDrawer: ae, UnsubscribeWrapper: ie };
   }
 });
 export {
-  Me as default
+  Re as default
 };

package/dist/components/organisms/email-preview/desktop-preview/EmailSizeIndicator.vue.js

@@ -3,14 +3,14 @@ import s from "./EmailSizeIndicator.vue2.js";
 import o from "../../../../_virtual/_plugin-vue2_normalizer.js";
 var r = function() {
   var i = this, e = i._self._c, t = i._self._setupProxy;
-  return e("div", { staticClass: "d-f a-i-c j-c-c" }, [t.previewStore.emailSizeKB ? [e(t.InProgress, { staticClass: "min-w-15-s", attrs: { id: "email-size-progress", "description-status": "", "description-position": "left", description: t.htmlSize, "max-value": t.MAX_EMAIL_SIZE_IN_KB, type: t.progress.type, value: t.progress.value } }), e(t.InTooltipV2, { attrs: { id: "email-size-tooltip", "icon-status": "", "static-position": "bottom center", "dynamic-position": !1, text: t.trans("email-editor.preview-design-size-tooltip") } })] : e(t.InSkeleton, { attrs: { sizing: { width: 200, height: 20 } } })], 2);
+  return e("div", { staticClass: "d-f a-i-c j-c-c" }, [t.previewStore.isLoaded ? [e(t.InProgress, { staticClass: "min-w-15-s", attrs: { id: "email-size-progress", "description-status": "", "description-position": "left", description: t.htmlSize, "max-value": t.MAX_EMAIL_SIZE_IN_KB, type: t.progress.type, value: t.progress.value } }), e(t.InTooltipV2, { attrs: { id: "email-size-tooltip", "icon-status": "", "static-position": "bottom center", "dynamic-position": !1, text: t.trans("email-editor.preview-design-size-tooltip") } })] : e(t.InSkeleton, { attrs: { sizing: { width: 200, height: 20 } } })], 2);
 }, a = [], n = /* @__PURE__ */ o(
   s,
   r,
   a,
   !1,
   null,
-  "c37b48e1"
+  "2cb418af"
 );
 const m = n.exports;
 export {

package/dist/composables/useSave.js

@@ -1,21 +1,23 @@
-import { useConfig as d } from "./useConfig.js";
-import { useSaveStart as p, useSaveComplete as f } from "./useGuidoActions.js";
-import { useSyncModuleExtractor as v } from "./useSyncModuleExtractor.js";
-import { useStripoApi as S } from "../services/stripoApi.js";
-import { useTemplatePreparation as x } from "../utils/templatePreparation.js";
-import { useHtmlValidator as V } from "./useHtmlValidator.js";
-const g = () => {
-  const o = p(), s = f(), { validateHtml: i } = V(), { callbacks: a } = d(), { extractSyncModuleData: r } = v(), { setSyncModuleUnsubscriptionPages: n } = S();
-  return { save: async (l = !1) => {
+import { useActionsApi as d } from "./useActionsApi.js";
+import { useConfig as f } from "./useConfig.js";
+import { useSaveStart as v, useSaveComplete as S } from "./useGuidoActions.js";
+import { useSyncModuleExtractor as x } from "./useSyncModuleExtractor.js";
+import { useStripoApi as V } from "../services/stripoApi.js";
+import { useTemplatePreparation as y } from "../utils/templatePreparation.js";
+import { useHtmlValidator as w } from "./useHtmlValidator.js";
+const k = () => {
+  const o = v(), s = S(), { validateHtml: i } = w(), { callbacks: a } = f(), { extractSyncModuleData: r } = x(), { setSyncModuleUnsubscriptionPages: n } = V(), { editorSave: l } = d();
+  return { save: async (c = !1) => {
     var e;
     o();
-    const { prepareTemplateDetails: c } = x(), t = await c();
+    const { prepareTemplateDetails: m } = y(), t = await m();
     if (!await i(t.compiledHtml, t.dynamicContentList, !0) || (e = a.value) != null && e.externalValidation && !await a.value.externalValidation(t))
       return;
-    const { unsubscribePayload: m, stripoModules: u } = r(t.rawHtml);
-    return await n(m), t.modules = u, l || s(t), t;
+    l();
+    const { unsubscribePayload: u, stripoModules: p } = r(t.rawHtml);
+    return await n(u), t.modules = p, c || s(t), t;
   } };
 };
 export {
-  g as useSave
+  k as useSave
 };

package/dist/config/migrator/checkboxMigrator.js

@@ -11,6 +11,8 @@ class f {
     try {
       const e = this.parser.parseFromString(t, "text/html"), i = e.querySelectorAll("td.checkbox-block");
       return i.length === 0 ? t : (i.forEach((r) => {
+        if (r.classList.contains("checkbox-block-v2"))
+          return;
         const n = r.getAttribute("id"), l = this.extractTextFromElement(r, "ins-title"), c = this.extractTextFromElement(r, "ins-description"), a = this.buildTextBlock(l), p = this.buildTextBlock(c), g = b.replace("{-{-TITLE-}-}", a).replace("{-{-DESCRIPTION-}-}", p), o = this.parser.parseFromString(
           `<table id="tempDoc"><tbody><tr>${g}</tr></tbody></table>`,
           "text/html"
@@ -22,7 +24,7 @@ class f {
     }
   }
   extractTextFromElement(t, e) {
-    var o, u;
+    var o, d;
     const i = t.querySelector(`.${e}`);
     if (!i)
       return {
@@ -41,13 +43,13 @@ class f {
         align: i.getAttribute("align") || "left",
         styles: ""
       };
-    const n = ((u = r.textContent) == null ? void 0 : u.trim()) || (e === "ins-title" ? "Title" : "Description"), l = r.getAttribute("style") || "", c = i.getAttribute("align") || r.getAttribute("align") || "left", a = /font-weight\s*:\s*bold/i.test(l) || !!r.querySelector("b, strong"), p = /font-style\s*:\s*italic/i.test(l) || !!r.querySelector("i, em"), g = this.removeStyleProperties(l, ["font-weight", "font-style"]), d = this.convertInlineToBlock(g);
+    const n = ((d = r.textContent) == null ? void 0 : d.trim()) || (e === "ins-title" ? "Title" : "Description"), l = r.getAttribute("style") || "", c = i.getAttribute("align") || r.getAttribute("align") || "left", a = /font-weight\s*:\s*bold/i.test(l) || !!r.querySelector("b, strong"), p = /font-style\s*:\s*italic/i.test(l) || !!r.querySelector("i, em"), g = this.removeStyleProperties(l, ["font-weight", "font-style"]), u = this.convertInlineToBlock(g);
     return {
       text: n,
       isBold: a,
       isItalic: p,
       align: c,
-      styles: d
+      styles: u
     };
   }
   buildTextBlock(t) {

package/dist/config/migrator/radioButtonMigrator.js

@@ -1,28 +1,30 @@
-var b = Object.defineProperty;
-var f = (r, t, e) => t in r ? b(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
-var x = (r, t, e) => f(r, typeof t != "symbol" ? t + "" : t, e);
+var x = Object.defineProperty;
+var f = (r, t, e) => t in r ? x(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
+var b = (r, t, e) => f(r, typeof t != "symbol" ? t + "" : t, e);
 import h from "../../extensions/Blocks/RadioButton/template.js";
 class T {
   constructor() {
-    x(this, "parser");
+    b(this, "parser");
     this.parser = new DOMParser();
   }
   migrate(t) {
     try {
       const e = this.parser.parseFromString(t, "text/html"), i = e.querySelectorAll("td.radio-button-block");
       return i.length === 0 ? t : (i.forEach((s) => {
-        const o = s.getAttribute("id"), l = this.extractTextFromElement(s, "ins-title"), a = this.extractTextFromElement(s, "ins-description"), p = this.extractTextFromElement(s, "ins-subscribe"), u = this.extractTextFromElement(s, "ins-unsubscribe"), d = this.buildTextBlock(l), g = this.buildTextBlock(a), m = this.buildTextBlock({ ...p, classList: "" }), n = this.buildTextBlock({ ...u, classList: "" }), c = h.replace("{-{-TITLE-}-}", d).replace("{-{-DESCRIPTION-}-}", g).replace("{-{-YES-}-}", m).replace("{-{-NO-}-}", n), y = this.parser.parseFromString(
+        if (s.classList.contains("radio-button-v2"))
+          return;
+        const n = s.getAttribute("id"), l = this.extractTextFromElement(s, "ins-title"), a = this.extractTextFromElement(s, "ins-description"), p = this.extractTextFromElement(s, "ins-subscribe"), u = this.extractTextFromElement(s, "ins-unsubscribe"), d = this.buildTextBlock(l), g = this.buildTextBlock(a), m = this.buildTextBlock({ ...p, classList: "" }), o = this.buildTextBlock({ ...u, classList: "" }), c = h.replace("{-{-TITLE-}-}", d).replace("{-{-DESCRIPTION-}-}", g).replace("{-{-YES-}-}", m).replace("{-{-NO-}-}", o), y = this.parser.parseFromString(
           `<table id="tempDoc"><tbody><tr>${c}</tr></tbody></table>`,
           "text/html"
         ).querySelector(".radio-button-v2");
-        y && s.parentNode && (y.setAttribute("id", o || ""), s.parentNode.replaceChild(y, s));
+        y && s.parentNode && (y.setAttribute("id", n || ""), s.parentNode.replaceChild(y, s));
       }), e.documentElement.outerHTML);
     } catch (e) {
       return console.error("RadioButtonMigrator failed:", e), t;
     }
   }
   extractTextFromElement(t, e) {
-    var n, c;
+    var o, c;
     const i = t.querySelector(`.${e}`);
     if (!i)
       return {
@@ -36,16 +38,16 @@ class T {
     const s = i.querySelector("p");
     if (!s)
       return {
-        text: ((n = i.textContent) == null ? void 0 : n.trim()) || (e === "ins-title" ? "Title" : "Description"),
+        text: ((o = i.textContent) == null ? void 0 : o.trim()) || (e === "ins-title" ? "Title" : "Description"),
         isBold: !1,
         isItalic: !1,
         align: i.getAttribute("align") || "left",
         styles: "",
         classList: ""
       };
-    const o = ((c = s.textContent) == null ? void 0 : c.trim()) || (e === "ins-title" ? "Title" : "Description"), l = s.getAttribute("style") || "", a = i.getAttribute("align") || s.getAttribute("align") || "left", p = /font-weight\s*:\s*bold/i.test(l) || !!s.querySelector("b, strong"), u = /font-style\s*:\s*italic/i.test(l) || !!s.querySelector("i, em"), d = this.removeStyleProperties(l, ["font-weight", "font-style"]), g = this.convertInlineToBlock(d), m = i.getAttribute("class") || "";
+    const n = ((c = s.textContent) == null ? void 0 : c.trim()) || (e === "ins-title" ? "Title" : "Description"), l = s.getAttribute("style") || "", a = i.getAttribute("align") || s.getAttribute("align") || "left", p = /font-weight\s*:\s*bold/i.test(l) || !!s.querySelector("b, strong"), u = /font-style\s*:\s*italic/i.test(l) || !!s.querySelector("i, em"), d = this.removeStyleProperties(l, ["font-weight", "font-style"]), g = this.convertInlineToBlock(d), m = i.getAttribute("class") || "";
     return {
-      text: o,
+      text: n,
       isBold: p,
       isItalic: u,
       align: a,
@@ -66,8 +68,8 @@ class T {
         `;
   }
   removeStyleProperties(t, e) {
-    return t ? e.reduce((s, o) => {
-      const l = new RegExp(`${o}\\s*:\\s*[^;]*;?`, "gi");
+    return t ? e.reduce((s, n) => {
+      const l = new RegExp(`${n}\\s*:\\s*[^;]*;?`, "gi");
       return s.replace(l, "");
     }, t).replace(/;\s*;/g, ";").replace(/^;|;$/g, "").trim() : "";
   }

package/dist/guido.css

@@ -1 +1 @@
-.gap-16[data-v-3b53a736],.gap-16[data-v-0e1b0c54]{gap:16px}[data-v-cd76c125] .in-button-v2__wrapper{line-height:0}[data-v-22226124] .in-segments-wrapper__button_selected,[data-v-22226124] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb;color:#0010ac;border-color:#0010ac}[data-v-c37b48e1] .in-progress-wrapper__progress p span:last-child{display:none!important}[data-v-c37b48e1] .in-progress-description-status{display:none!important}.view-options-wrapper[data-v-195ab6d4]{position:relative;display:inline-block}.new-tag[data-v-195ab6d4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-195ab6d4] .guido__view-option-selection-desktop svg,[data-v-195ab6d4] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-195ab6d4] .in-segments-wrapper__button_selected,[data-v-195ab6d4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-195ab6d4] .in-tooltip-wrapper__icon{cursor:pointer}.editor-toolbar[data-v-173c3a40]{gap:4px}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history[data-v-64c52560]{gap:8px}.version-history__toolbar[data-v-64c52560]{gap:4px}.view-options-wrapper[data-v-d405ca59]{position:relative;display:inline-block}.new-tag[data-v-d405ca59]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-d405ca59] .guido__verion-history-view-option-selection-desktop svg,[data-v-d405ca59] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d405ca59] .in-segments-wrapper__button_selected,[data-v-d405ca59] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-d405ca59] .in-tooltip-wrapper__icon{cursor:pointer}.editor-actions[data-v-acff76a8]{gap:4px}.header-wrapper[data-v-5c02dcc7]{min-width:1000px}.guido-loading__wrapper[data-v-07c4b2d8]{height:100%;top:75px!important;bottom:0!important}.guido-editor__wrapper[data-v-a26d7792]{position:relative;width:100%;height:calc(100vh - 128px)}.guido-editor__container[data-v-a26d7792]{width:100%;height:calc(100vh - 128px)}.guido-editor__no-header[data-v-a26d7792]{height:calc(100vh - 75px)}[data-v-293f1c47] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-df672485]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-df672485]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-df672485]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-df672485]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-df672485]{object-fit:cover;transform:scale(1)}[data-v-43c617a7] .guido__verion-history-view-option-selection-desktop svg,[data-v-43c617a7] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-43c617a7] .in-segments-wrapper__button_selected,[data-v-43c617a7] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-c3fd5d4b]{gap:16px}.desktop-browser-header[data-v-d86c5af5]{height:79px;min-height:79px}.desktop-browser-header__left[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:378px}.desktop-browser-header__center[data-v-d86c5af5]{height:79px;background-repeat:repeat-x;background-size:auto 100%;background-position:left top}.desktop-browser-header__right[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:112px}.desktop-preview[data-v-988f8da6]{min-width:602px;height:70vh;min-height:583px;border-radius:10px}.desktop-preview iframe[data-v-988f8da6]{min-height:504px}.iframe-wrapper[data-v-e0424e99]{width:258px}.iframe-scaled[data-v-e0424e99]{width:320px;height:124.0310077519%;transform:scale(.80625);transform-origin:top left}.cropped-text[data-v-eb3d05d7]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-preview-wrapper__phone[data-v-3f472f96]{width:282px}.mobile-preview-wrapper__phone img[data-v-3f472f96]{object-fit:cover;border-radius:44px}.mobile-preview-wrapper__content[data-v-3f472f96]{width:258px;height:450px;left:12px}[data-v-29b9af29] .vueperslides__bullets,[data-v-dd1a237a] .vueperslides__bullets{pointer-events:none!important}[data-v-dd1a237a] .vueperslides__parallax-wrapper{height:110px!important}[data-v-d073b1dc] .vueperslides__bullets{pointer-events:none!important}[data-v-d073b1dc] .vueperslides__parallax-wrapper{height:110px!important}
+.gap-16[data-v-3b53a736],.gap-16[data-v-0e1b0c54]{gap:16px}[data-v-cd76c125] .in-button-v2__wrapper{line-height:0}[data-v-22226124] .in-segments-wrapper__button_selected,[data-v-22226124] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb;color:#0010ac;border-color:#0010ac}[data-v-2cb418af] .in-progress-wrapper__progress p span:last-child{display:none!important}[data-v-2cb418af] .in-progress-description-status{display:none!important}.view-options-wrapper[data-v-195ab6d4]{position:relative;display:inline-block}.new-tag[data-v-195ab6d4]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-195ab6d4] .guido__view-option-selection-desktop svg,[data-v-195ab6d4] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-195ab6d4] .in-segments-wrapper__button_selected,[data-v-195ab6d4] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-195ab6d4] .in-tooltip-wrapper__icon{cursor:pointer}.editor-toolbar[data-v-173c3a40]{gap:4px}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history[data-v-64c52560]{gap:8px}.version-history__toolbar[data-v-64c52560]{gap:4px}.view-options-wrapper[data-v-d405ca59]{position:relative;display:inline-block}.new-tag[data-v-d405ca59]{position:absolute;top:-8px;right:-16px;z-index:10}[data-v-d405ca59] .guido__verion-history-view-option-selection-desktop svg,[data-v-d405ca59] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-d405ca59] .in-segments-wrapper__button_selected,[data-v-d405ca59] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-d405ca59] .in-tooltip-wrapper__icon{cursor:pointer}.editor-actions[data-v-acff76a8]{gap:4px}.header-wrapper[data-v-5c02dcc7]{min-width:1000px}.guido-loading__wrapper[data-v-07c4b2d8]{height:100%;top:75px!important;bottom:0!important}.guido-editor__wrapper[data-v-25780af6]{--ribbon-offset: 0px;position:relative;width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__container[data-v-25780af6]{width:100%;height:calc(100vh - 128px - var(--ribbon-offset))}.guido-editor__no-header[data-v-25780af6]{height:calc(100vh - 75px - var(--ribbon-offset))}[data-v-293f1c47] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-df672485]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-df672485]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-df672485]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-df672485]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-df672485]{object-fit:cover;transform:scale(1)}[data-v-43c617a7] .guido__verion-history-view-option-selection-desktop svg,[data-v-43c617a7] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-43c617a7] .in-segments-wrapper__button_selected,[data-v-43c617a7] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-c3fd5d4b]{gap:16px}.desktop-browser-header[data-v-d86c5af5]{height:79px;min-height:79px}.desktop-browser-header__left[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:378px}.desktop-browser-header__center[data-v-d86c5af5]{height:79px;background-repeat:repeat-x;background-size:auto 100%;background-position:left top}.desktop-browser-header__right[data-v-d86c5af5]{-webkit-user-drag:none;height:79px;width:112px}.desktop-preview[data-v-988f8da6]{min-width:602px;height:70vh;min-height:583px;border-radius:10px}.desktop-preview iframe[data-v-988f8da6]{min-height:504px}.iframe-wrapper[data-v-e0424e99]{width:258px}.iframe-scaled[data-v-e0424e99]{width:320px;height:124.0310077519%;transform:scale(.80625);transform-origin:top left}.cropped-text[data-v-eb3d05d7]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-preview-wrapper__phone[data-v-3f472f96]{width:282px}.mobile-preview-wrapper__phone img[data-v-3f472f96]{object-fit:cover;border-radius:44px}.mobile-preview-wrapper__content[data-v-3f472f96]{width:258px;height:450px;left:12px}[data-v-29b9af29] .vueperslides__bullets,[data-v-dd1a237a] .vueperslides__bullets{pointer-events:none!important}[data-v-dd1a237a] .vueperslides__parallax-wrapper{height:110px!important}[data-v-d073b1dc] .vueperslides__bullets{pointer-events:none!important}[data-v-d073b1dc] .vueperslides__parallax-wrapper{height:110px!important}

package/dist/services/recommendationApi.js

@@ -1,34 +1,36 @@
 import { useHttp as c } from "../composables/useHttp.js";
-import { URLS as m } from "../enums/extensions/recommendationBlock.js";
+import { URLS as i } from "../enums/extensions/recommendationBlock.js";
 const f = () => {
-  const { get: o } = c();
+  const { get: r } = c(), a = "6KcLM9TwheVB1mgK";
   return {
     fetchRecommendationCreateData: async () => {
       try {
-        return (await o("/newsletter/recommendations/create-data")).data;
+        return (await r("/newsletter/recommendations/create-data")).data;
       } catch (e) {
         throw console.error("fetchUserModalState error:", e), e;
       }
     },
     fetchRecommendationFilters: async () => {
       try {
-        const { data: e } = await o("/stripo/email-recommendation-attributes");
+        const { data: e } = await r("/stripo/email-recommendation-attributes");
         return e;
       } catch (e) {
         throw console.error("fetchRecommendationFilters error:", e), e;
       }
     },
-    fetchRecommendationProducts: async (e, a) => {
+    fetchRecommendationProducts: async (e, s) => {
       var n;
       try {
-        const t = decodeURIComponent(new URLSearchParams(Object.entries(a)).toString());
+        const t = decodeURIComponent(new URLSearchParams(Object.entries(s)).toString());
         console.debug("🏁 Recommendation API Query:", t);
-        const { get: s } = c({
-          headers: {}
-        }), r = await s(
-          `${m.RECOMMENDATION_API_URL}/v2/${e}?${t}`
+        const { get: m } = c({
+          headers: {
+            "X-CLIENT-ID": a
+          }
+        }), o = await m(
+          `${i.RECOMMENDATION_API_URL}/v2/${e}?${t}`
         );
-        return ((n = r == null ? void 0 : r.data) == null ? void 0 : n.data) ?? [];
+        return ((n = o == null ? void 0 : o.data) == null ? void 0 : n.data) ?? [];
       } catch (t) {
         throw console.error("fetchRecommendationProducts error:", t), t;
       }

package/dist/src/@types/config/index.d.ts

@@ -8,7 +8,7 @@
  * - Validation utilities
  */
 export { MessageType, ProductType, GuidoConfigSchema, IdentitySchema, PartnerSchema, TemplateSchema, EditorSchema, UISchema, FeaturesSchema, BlocksSchema, CompilerSchema, CallbacksSchema, DynamicContentSchema, EmailHeaderSchema, DefaultBlockTypeSchema, CustomBlockTypeSchema, CompilerRuleSchema, CompilerRuleTypeSchema, ReplaceRuleSchema, RegexRuleSchema, RemoveRuleSchema, CustomRuleSchema, } from './schemas';
-export type { GuidoConfig, GuidoConfigInput, IdentityConfig, IdentityConfigInput, PartnerConfig, PartnerConfigInput, TemplateConfig, TemplateConfigInput, EditorConfig, EditorConfigInput, UIConfig, UIConfigInput, FeaturesConfig, FeaturesConfigInput, BlocksConfig, BlocksConfigInput, CompilerConfig, CompilerConfigInput, CallbacksConfig, CallbacksConfigInput, ExternalValidationHandler, EmailHeader, DynamicContent, DefaultBlockType, CustomBlockType, BlockType, FeatureName, CompilerRule, ReplaceRule, RegexRule, RemoveRule, CustomRule, DeepPartial, ConfigOverrides, } from './types';
+export type { GuidoConfig, GuidoConfigInput, IdentityConfig, IdentityConfigInput, PartnerConfig, PartnerConfigInput, FallbackFont, TemplateConfig, TemplateConfigInput, EditorConfig, EditorConfigInput, UIConfig, UIConfigInput, FeaturesConfig, FeaturesConfigInput, BlocksConfig, BlocksConfigInput, CompilerConfig, CompilerConfigInput, CallbacksConfig, CallbacksConfigInput, ExternalValidationHandler, EmailHeader, DynamicContent, DefaultBlockType, CustomBlockType, BlockType, FeatureName, CompilerRule, ReplaceRule, RegexRule, RemoveRule, CustomRule, DeepPartial, ConfigOverrides, } from './types';
 export { DEFAULT_EMAIL_HEADER, DEFAULT_TEMPLATE, DEFAULT_EDITOR, DEFAULT_UI, DEFAULT_FEATURES, DEFAULT_BLOCKS, DEFAULT_COMPILER, DEFAULT_PRODUCT_TYPE, DEFAULT_MESSAGE_TYPE, DEFAULT_USERNAME, EDITOR_TYPE, TEST_PARTNERS, isTestPartner, } from './defaults';
 export { validateConfig, parseConfig, parseConfigSafe, getValidationErrors, isValidConfig, validateIdentity, validatePartner, } from './validator';
 export type { ValidationResult, ValidationError, } from './validator';

package/dist/src/@types/config/types.d.ts

@@ -5,7 +5,7 @@
  * This ensures type definitions are always in sync with validation.
  * @module @types/config/types
  */
-import type { GuidoConfigSchema, IdentitySchema, PartnerSchema, TemplateSchema, EditorSchema, UISchema, FeaturesSchema, BlocksSchema, CompilerSchema, CallbacksSchema, DynamicContentSchema, EmailHeaderSchema, CompilerRuleSchema, ReplaceRuleSchema, RegexRuleSchema, RemoveRuleSchema, CustomRuleSchema, DefaultBlockTypeSchema, CustomBlockTypeSchema, ExternalValidationHandler } from './schemas';
+import type { GuidoConfigSchema, IdentitySchema, PartnerSchema, TemplateSchema, EditorSchema, UISchema, FeaturesSchema, BlocksSchema, CompilerSchema, CallbacksSchema, DynamicContentSchema, EmailHeaderSchema, CompilerRuleSchema, ReplaceRuleSchema, RegexRuleSchema, RemoveRuleSchema, CustomRuleSchema, DefaultBlockTypeSchema, CustomBlockTypeSchema, FallbackFontSchema, ExternalValidationHandler } from './schemas';
 import type * as v from 'valibot';
 /**
  * Complete validated Guido configuration.
@@ -29,6 +29,8 @@ export type GuidoConfig = v.InferOutput<typeof GuidoConfigSchema>;
 export type IdentityConfig = v.InferOutput<typeof IdentitySchema>;
 /** Partner configuration (name, productType, messageType, username) */
 export type PartnerConfig = v.InferOutput<typeof PartnerSchema>;
+/** Fallback font settings for backend size calculation alignment */
+export type FallbackFont = v.InferOutput<typeof FallbackFontSchema>;
 /** Template configuration (html, css, dynamic content, unsubscribe pages) */
 export type TemplateConfig = v.InferOutput<typeof TemplateSchema>;
 /** Editor configuration (locale, translations, migration date, email header) */

package/dist/src/@types/generic.d.ts

@@ -44,7 +44,6 @@ export interface TooltipOptions {
         x: number;
         y: number;
     };
-    preventXss?: boolean;
 }
 export type TextValueObject = {
     text: string;

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

@@ -1,4 +1,5 @@
-import type { CompilerRule, CompilationResult, FallbackFont, HtmlCompiler } from '@@/Types/html-compiler';
+import type { FallbackFont } from '@@/Types/config';
+import type { CompilerRule, CompilationResult, HtmlCompiler } from '@@/Types/html-compiler';
 export declare class HtmlCompilerEngine implements HtmlCompiler {
     private rules;
     constructor(rules?: CompilerRule[]);

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

@@ -1,11 +1,16 @@
-const t = `.amp-input-list,
+const n = `.amp-input-list,
 .button,
 .base-input,
 ue-stripe-thumb,
 .ue-stripe-thumb {
     transition: all .5s ease;
 }
+
+:host {
+    height: 100% !important;
+    min-height: 0 !important;
+}
 `;
 export {
-  t as default
+  n as default
 };

package/dist/utils/htmlCompiler.js

@@ -1,32 +1,38 @@
-var x = Object.defineProperty;
-var E = (p, e, t) => e in p ? x(p, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : p[e] = t;
-var y = (p, e, t) => E(p, typeof e != "symbol" ? e + "" : e, t);
-import { useToaster as A } from "../composables/useToaster.js";
-const T = /font-family\s*:[^;}"']+/gi;
-class w {
+var h = Object.defineProperty;
+var f = (o, e, t) => e in o ? h(o, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : o[e] = t;
+var m = (o, e, t) => f(o, typeof e != "symbol" ? e + "" : e, t);
+import { useToaster as x } from "../composables/useToaster.js";
+const E = /font-family\s*:[^;}"']+/gi;
+class T {
   constructor(e = []) {
-    y(this, "rules");
+    m(this, "rules");
     this.rules = e;
   }
   compile(e, t, r) {
-    const s = performance.now(), i = e, o = e.length;
-    let n = e;
-    const l = [];
-    (t || this.rules).sort((c, u) => c.priority - u.priority).forEach((c) => {
-      const u = n.length;
-      n = this.applyRule(n, c), n.length !== u && l.push(c.id);
+    const n = performance.now(), l = e, c = e.length;
+    let s = e;
+    const i = [];
+    (t || this.rules).sort((p, a) => p.priority - a.priority).forEach((p) => {
+      const a = s.length;
+      s = this.applyRule(s, p), s.length !== a && i.push(p.id);
     });
-    const m = n.length, R = o > 0 ? (o - m) / o * 100 : 0, a = `, ${r == null ? void 0 : r.name}, ${r == null ? void 0 : r.family}`, d = (r != null && r.name && (r != null && r.family) ? (n.match(T) || []).length : 0) * a.length, g = new TextEncoder().encode(n).byteLength, h = Math.round((g + d) / 1024);
+    const u = s.length, R = c > 0 ? (c - u) / c * 100 : 0, d = new TextEncoder().encode(s).byteLength;
+    let y = 0;
+    if (r && r.name && r.family) {
+      const p = (s.match(E) || []).length, a = `, ${r.name}, ${r.family}`;
+      y = p * new TextEncoder().encode(a).byteLength;
+    }
+    const g = Math.round((d + y) / 1024);
     return {
-      originalHtml: i,
-      compiledHtml: n,
-      appliedRules: l,
-      estimatedSizeKB: h,
+      originalHtml: l,
+      compiledHtml: s,
+      appliedRules: i,
+      estimatedSizeKB: g,
       stats: {
-        originalSize: o,
-        compiledSize: m,
+        originalSize: c,
+        compiledSize: u,
         reductionPercentage: R,
-        executionTime: performance.now() - s
+        executionTime: performance.now() - n
       }
     };
   }
@@ -45,27 +51,27 @@ class w {
           return e;
       }
     } catch (r) {
-      const { handleError: s } = A();
-      return s(r, `Failed to apply rule ${t.id}:`), e;
+      const { handleError: n } = x();
+      return n(r, `Failed to apply rule ${t.id}:`), e;
     }
   }
   applyReplaceRule(e, t) {
-    const { search: r, replacement: s, replaceAll: i = !0 } = t;
-    return i ? e.replaceAll(r, s) : e.replace(r, s);
+    const { search: r, replacement: n, replaceAll: l = !0 } = t;
+    return l ? e.replaceAll(r, n) : e.replace(r, n);
   }
   applyRegexRule(e, t) {
-    const { pattern: r, replacement: s, flags: i = "g" } = t, o = new RegExp(r, i);
-    return e.replace(o, s);
+    const { pattern: r, replacement: n, flags: l = "g" } = t, c = new RegExp(r, l);
+    return e.replace(c, n);
   }
   applyRemoveRule(e, t) {
-    return t.targets.reduce((r, s) => s instanceof RegExp ? r.replace(s, "") : r.replaceAll(s, ""), e);
+    return t.targets.reduce((r, n) => n instanceof RegExp ? r.replace(n, "") : r.replaceAll(n, ""), e);
   }
   applyCustomRule(e, t) {
     return t.processor(e);
   }
 }
-const v = (p = []) => new w(p);
+const H = (o = []) => new T(o);
 export {
-  w as HtmlCompilerEngine,
-  v as createHtmlCompiler
+  T as HtmlCompilerEngine,
+  H as createHtmlCompiler
 };

package/dist/utils/templatePreparation.js

@@ -1,44 +1,50 @@
-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 w = () => {
-  const o = x(), e = y(), { getCompiledEmail: i, getTemplateData: s, editorSave: n } = f(), { compileHtml: a } = C();
+import { useActionsApi as S } from "../composables/useActionsApi.js";
+import { useHtmlCompiler as T } from "../composables/useHtmlCompiler.js";
+import { useRecommendationExtensionStore as x } from "../extensions/Blocks/Recommendation/store/recommendation.js";
+import { DATA_ATTRIBUTES as C } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
+import { parsePageList as P } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
+import { useDynamicContentStore as D } from "../stores/dynamic-content.js";
+import { useUnsubscribeStore as H } from "../stores/unsubscribe.js";
+function U(n, e) {
+  const s = new RegExp(`${C.PAGE_LIST}="([^"]*)"`), t = n.match(s), o = t != null && t[1] ? P(t[1]) : [];
+  return o.length ? e.filter((r) => o.includes(r)) : e;
+}
+const R = () => {
+  const n = D(), e = H(), { getCompiledEmail: s, getTemplateData: t } = S(), { compileHtml: o } = T();
   return {
     prepareTemplateDetails: async () => {
-      const { html: m, ampHtml: r = "", ampErrors: c = [] } = await i({
+      const { html: a, ampHtml: c = "", ampErrors: l = [] } = await s({
         minimize: !0,
         resetDataSavedFlag: !1
-      }), { html: l, css: p, syncModulesIds: u = [] } = await s();
+      }), { html: p, css: u, syncModulesIds: d = [] } = await t();
       e.selectedUnsubscribePages.length && await e.fetchTemplates();
-      const { compiledHtml: d, stats: t, appliedRules: g } = a(m), S = o.getSelectedDynamicContentList, b = T();
-      return n(), console.debug("HTML Compilation Stats:", {
-        originalSize: t.originalSize,
-        compiledSize: t.compiledSize,
-        reduction: `${t.reductionPercentage.toFixed(2)}%`,
+      const { compiledHtml: m, stats: i, appliedRules: g } = o(a), b = n.getSelectedDynamicContentList, f = x();
+      return console.debug("HTML Compilation Stats:", {
+        originalSize: i.originalSize,
+        compiledSize: i.compiledSize,
+        reduction: `${i.reductionPercentage.toFixed(2)}%`,
         appliedRules: g,
-        executionTime: `${t.executionTime.toFixed(2)}ms`
+        executionTime: `${i.executionTime.toFixed(2)}ms`
       }), {
-        dynamicContentList: S,
-        compiledHtml: d,
-        rawHtml: l,
-        css: p,
-        ampHtml: r,
-        ampErrors: c,
-        modules: u.map(Number),
+        dynamicContentList: b,
+        compiledHtml: m,
+        rawHtml: p,
+        css: u,
+        ampHtml: c,
+        ampErrors: l,
+        modules: d.map(Number),
         recommendation: {
-          campaignUrls: b.recommendationCampaignUrls,
+          campaignUrls: f.recommendationCampaignUrls,
           configs: {}
         },
         unsubscribe: {
           status: e.unsubscribePagesStatus,
-          config: e.selectedUnsubscribePages
+          config: U(m, e.selectedUnsubscribePages)
         }
       };
     }
   };
 };
 export {
-  w as useTemplatePreparation
+  R as useTemplatePreparation
 };

package/dist/utils/tooltipUtils.js

@@ -1,11 +1,10 @@
-const e = (s, t = {}) => ({
-  id: s,
+const o = (i, t = {}) => ({
+  id: i,
   dynamicPosition: t.dynamicPosition ?? !1,
   staticPosition: t.staticPosition ?? "bottom center",
   iconStatus: t.iconStatus ?? !1,
-  offset: t.offset,
-  preventXss: t.preventXss
+  offset: t.offset
 });
 export {
-  e as getTooltipOptions
+  o as getTooltipOptions
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.1.1-beta.23117ce",
+  "version": "3.1.1-beta.240b117",
   "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",
@@ -33,7 +33,7 @@
   "license": "ISC",
   "dependencies": {
     "@stripoinc/ui-editor-extensions": "3.5.0",
-    "@useinsider/design-system-vue": "0.14.28",
+    "@useinsider/design-system-vue": "1.1.0-beta.73ec2fa",
     "@vueuse/core": "11.3.0",
     "lodash-es": "4.17.21",
     "pinia": "2.3.1",