@useinsider/guido 3.2.0-beta.e01b42a → 3.2.0

package/dist/components/organisms/header/EditorActions.vue2.js

@@ -1,51 +1,66 @@
-import { defineComponent as E, ref as n, computed as g } from "vue";
-import { useConfig as w } from "../../../composables/useConfig.js";
-import { useExport as C } from "../../../composables/useExport.js";
-import { useTestEmailClick as M } from "../../../composables/useGuidoActions.js";
-import { useSave as O } from "../../../composables/useSave.js";
-import { useTranslations as A } from "../../../composables/useTranslations.js";
-import { useVersionHistoryApi as k } from "../../../composables/useVersionHistoryApi.js";
-import { useEditorStore as B } from "../../../stores/editor.js";
-import { useTemplateStore as R } from "../../../stores/template.js";
-import { getTooltipOptions as b } from "../../../utils/tooltipUtils.js";
-import { InButtonV2 as D } from "@useinsider/design-system-vue";
-import { storeToRefs as I } from "pinia";
-import P from "./MigrationConfirmModal.vue.js";
-const Z = /* @__PURE__ */ E({
+import { defineComponent as O, ref as n, computed as h } from "vue";
+import { useActionsApi as q } from "../../../composables/useActionsApi.js";
+import { useConfig as b } from "../../../composables/useConfig.js";
+import { useExport as k } from "../../../composables/useExport.js";
+import { useTestEmailClick as B } from "../../../composables/useGuidoActions.js";
+import { useHtmlCompiler as D } from "../../../composables/useHtmlCompiler.js";
+import { useSave as F } from "../../../composables/useSave.js";
+import { useTranslations as L } from "../../../composables/useTranslations.js";
+import { useVersionHistoryApi as R } from "../../../composables/useVersionHistoryApi.js";
+import { useLiquidValidator as z } from "../../../composables/validators/useLiquidValidator.js";
+import { useEditorStore as I } from "../../../stores/editor.js";
+import { useTemplateStore as P } from "../../../stores/template.js";
+import { getTooltipOptions as j } from "../../../utils/tooltipUtils.js";
+import { InButtonV2 as G } from "@useinsider/design-system-vue";
+import { storeToRefs as J } from "pinia";
+import K from "./MigrationConfirmModal.vue.js";
+const ut = /* @__PURE__ */ O({
   __name: "EditorActions",
-  setup(j, { expose: H }) {
-    const { config: a } = w(), { exportHtml: m } = C(), { save: p } = O(), { openVersionHistory: l, closeVersionHistory: u } = k(), e = B(), c = R(), { hasMigrations: f } = I(c), r = A(), s = n(!1), i = n(!1), v = n(), S = M(), V = () => {
+  setup(N, { expose: x }) {
+    const { config: a, isFeatureEnabled: l } = b(), { exportHtml: m } = k(), { save: u } = F(), { openVersionHistory: c, closeVersionHistory: p } = R(), { getCompiledEmail: f } = q(), { compileHtml: d } = D(), { validateLiquidSyntax: v } = z(), e = I(), y = P(), { hasMigrations: S } = J(y), s = L(), i = n(!1), r = n(!1), g = n(), H = B(), T = () => {
       if (e.isVersionHistoryOpen) {
-        u();
+        p();
         return;
       }
-      l();
-    }, T = async () => {
-      s.value = !0, await m(), s.value = !1;
+      c();
+    }, w = async () => {
+      i.value = !0, await m(), i.value = !1;
     }, _ = () => {
       e.isSaveAsTemplateDrawerOpen = !0;
-    }, h = g(() => e.isVersionHistoryOpen ? r("newsletter.close-version-history") : r("newsletter.version-history")), x = g(
+    }, C = h(() => e.isVersionHistoryOpen ? s("newsletter.close-version-history") : s("newsletter.version-history")), A = h(
       () => {
-        var o, t;
-        return ((t = (o = a.value) == null ? void 0 : o.features) == null ? void 0 : t.versionHistory) && !e.isPreviewModeOpen;
+        var t, o;
+        return ((o = (t = a.value) == null ? void 0 : t.features) == null ? void 0 : o.versionHistory) && !e.isPreviewModeOpen;
       }
-    ), d = async (o) => {
-      i.value = !0, e.loadingStatus = !0;
-      const t = await p(o);
-      return i.value = !1, (o || !t) && (e.loadingStatus = !1), t;
-    }, y = (o) => {
-      var t;
-      if (!o && f.value) {
-        (t = v.value) == null || t.open();
+    ), V = async (t) => {
+      r.value = !0, e.loadingStatus = !0;
+      const o = await u(t);
+      return r.value = !1, (t || !o) && (e.loadingStatus = !1), o;
+    }, E = (t) => {
+      var o;
+      if (!t && S.value) {
+        (o = g.value) == null || o.open();
         return;
       }
-      return d(o);
+      return V(t);
+    }, M = async () => {
+      if (l("liquidSyntax")) {
+        e.loadingStatus = !0;
+        try {
+          const { html: t } = await f({ minimize: !0, resetDataSavedFlag: !1 }), { compiledHtml: o } = d(t);
+          if (!await v(o))
+            return;
+        } finally {
+          e.loadingStatus = !1;
+        }
+      }
+      H();
     };
-    return H({
-      handleSave: y
-    }), { __sfc: !0, config: a, exportHtml: m, save: p, openVersionHistory: l, closeVersionHistory: u, editorStore: e, templateStore: c, hasMigrations: f, trans: r, isExporting: s, isSaving: i, migrationModalRef: v, testEmailClick: S, handleVersionHistory: V, handleExport: T, handleSaveAs: _, versionHistoryTooltipText: h, isVersionHistoryButtonVisible: x, executeSave: d, handleSave: y, getTooltipOptions: b, InButtonV2: D, MigrationConfirmModal: P };
+    return x({
+      handleSave: E
+    }), { __sfc: !0, config: a, isFeatureEnabled: l, exportHtml: m, save: u, openVersionHistory: c, closeVersionHistory: p, getCompiledEmail: f, compileHtml: d, validateLiquidSyntax: v, editorStore: e, templateStore: y, hasMigrations: S, trans: s, isExporting: i, isSaving: r, migrationModalRef: g, testEmailClick: H, handleVersionHistory: T, handleExport: w, handleSaveAs: _, versionHistoryTooltipText: C, isVersionHistoryButtonVisible: A, executeSave: V, handleSave: E, handleTestEmail: M, getTooltipOptions: j, InButtonV2: G, MigrationConfirmModal: K };
   }
 });
 export {
-  Z as default
+  ut as default
 };

package/dist/components/organisms/header/RightSlot.vue.js

@@ -1,17 +1,17 @@
-import o from "./RightSlot.vue2.js";
-import s from "../../../_virtual/_plugin-vue2_normalizer.js";
-var n = function() {
-  var r = this, t = r._self._c, e = r._self._setupProxy;
-  return t("div", { staticClass: "d-f" }, [e.editorStore.isVersionHistoryOpen ? t(e.RestoreButton) : t(e.EditorActions, { ref: "editorActionsRef" })], 1);
-}, i = [], _ = /* @__PURE__ */ s(
-  o,
-  n,
+import i from "./RightSlot.vue2.js";
+import r from "../../../_virtual/_plugin-vue2_normalizer.js";
+var o = function() {
+  var s = this, e = s._self._c, t = s._self._setupProxy;
+  return e("div", { staticClass: "d-f a-i-c" }, [t.isLiquidEnabled && !t.editorStore.isVersionHistoryOpen ? e(t.InChips, { staticClass: "mr-3", attrs: { id: "guido__liquid-tag-chip", styles: "stroke", type: "default", value: "liquid-tags", "close-button": !1, "disabled-status": t.editorStore.loadingStatus, interactive: !1, text: t.trans("email-editor.liquid-tags-enabled") } }) : s._e(), t.editorStore.isVersionHistoryOpen ? e(t.RestoreButton) : e(t.EditorActions, { ref: "editorActionsRef" })], 1);
+}, a = [], n = /* @__PURE__ */ r(
   i,
+  o,
+  a,
   !1,
   null,
   null
 );
-const l = _.exports;
+const u = n.exports;
 export {
-  l as default
+  u as default
 };

package/dist/components/organisms/header/RightSlot.vue2.js

@@ -1,19 +1,22 @@
-import { defineComponent as i, ref as s } from "vue";
-import { useEditorStore as m } from "../../../stores/editor.js";
-import f from "./EditorActions.vue.js";
-import a from "./version-history/RestoreButton.vue.js";
-const l = /* @__PURE__ */ i({
+import { defineComponent as a, ref as f, computed as p } from "vue";
+import { useConfig as u } from "../../../composables/useConfig.js";
+import { useTranslations as d } from "../../../composables/useTranslations.js";
+import { useEditorStore as c } from "../../../stores/editor.js";
+import { InChips as l } from "@useinsider/design-system-vue";
+import _ from "./EditorActions.vue.js";
+import S from "./version-history/RestoreButton.vue.js";
+const x = /* @__PURE__ */ a({
   __name: "RightSlot",
-  setup(p, { expose: e }) {
-    const r = m(), o = s(null);
-    return e({
-      handleSave: (n) => {
-        var t;
-        return (t = o.value) == null ? void 0 : t.handleSave(n);
+  setup(h, { expose: r }) {
+    const { isFeatureEnabled: o } = u(), n = d(), i = c(), t = f(null), s = p(() => o("liquidSyntax"));
+    return r({
+      handleSave: (m) => {
+        var e;
+        return (e = t.value) == null ? void 0 : e.handleSave(m);
       }
-    }), { __sfc: !0, editorStore: r, editorActionsRef: o, EditorActions: f, RestoreButton: a };
+    }), { __sfc: !0, isFeatureEnabled: o, trans: n, editorStore: i, editorActionsRef: t, isLiquidEnabled: s, InChips: l, EditorActions: _, RestoreButton: S };
   }
 });
 export {
-  l as default
+  x as default
 };

package/dist/components/organisms/save-as-template/SaveAsTemplateDrawer.vue2.js

@@ -10,29 +10,29 @@ import { useDebounceFn as V } from "../../../node_modules/@vueuse/shared/index.j
 const H = /* @__PURE__ */ A({
   __name: "SaveAsTemplateDrawer",
   setup(E) {
-    const s = O(), o = D(), t = k(), { createTemplate: m } = B(), a = c(!1), n = c(!1), r = c(""), f = b(() => ({
+    const o = O(), n = D(), t = k(), { createTemplate: m } = B(), a = c(!1), r = c(!1), l = c(""), f = b(() => ({
       primaryButton: {
         styling: "solid",
         type: "primary",
-        labelText: s(a.value ? "newsletter.saving" : "products.save"),
+        labelText: o(a.value ? "newsletter.saving" : "products.save"),
         loadingStatus: a.value,
         disabledStatus: t.skeletonStatus
       },
       cancelOrBackButton: {
         styling: "ghost",
         type: "secondary",
-        labelText: s("products.cancel"),
+        labelText: o("products.cancel"),
         disabledStatus: a.value
       }
-    })), p = () => {
-      r.value = "", o.isSaveAsTemplateDrawerOpen = !1;
-    }, l = async () => {
-      const e = h(t, "templateName"), { success: i, errorMessage: _ } = await x(e).validate();
-      return r.value = _, i;
+    })), u = () => {
+      l.value = "", n.isSaveAsTemplateDrawerOpen = !1;
+    }, i = async () => {
+      const e = h(t, "templateName"), { success: s, errorMessage: _ } = await x(e).validate();
+      return l.value = _, s;
     }, v = V(async (e) => {
-      t.templateName = e, await l();
+      t.templateName = e, await i();
     }, 500), g = async (e) => {
-      n.value = !0, await t.addCategory(e), n.value = !1;
+      r.value = !0, await t.addCategory(e), r.value = !1;
     }, y = (e) => {
       t.selectedCategories = e;
     }, S = (e) => {
@@ -40,22 +40,23 @@ const H = /* @__PURE__ */ A({
     }, T = () => {
       t.selectedCategories = [];
     }, w = async () => {
-      if (a.value = !0, !await l()) {
+      if (a.value = !0, !await i()) {
         a.value = !1;
         return;
       }
-      await m(), a.value = !1, p();
-    }, u = () => {
+      const s = await m();
+      a.value = !1, s && u();
+    }, p = () => {
       C(() => {
         const e = document.querySelector("input#guido__template-name-input");
         e == null || e.focus();
       });
     }, d = async () => {
-      t.$reset(), await t.fetchCategories(), t.skeletonStatus = !1, u();
+      t.$reset(), await t.fetchCategories(), t.skeletonStatus = !1, p();
     };
-    return o.$subscribe((e, { isSaveAsTemplateDrawerOpen: i }) => {
-      i && d();
-    }), { __sfc: !0, trans: s, editorStore: o, saveAsTemplateStore: t, createTemplate: m, isSaving: a, isAddingOption: n, templateNameError: r, footerButtonGroupOptions: f, closeModal: p, validateTemplateName: l, handleTemplateName: v, handleAddOption: g, handleCategoryChange: y, handleSelectAllOptions: S, handleResetAllOptions: T, saveTemplate: w, focusToInput: u, initializeDrawer: d, WpDrawer: N, InBasicTextInput: M, InMultiSelect: I };
+    return n.$subscribe((e, { isSaveAsTemplateDrawerOpen: s }) => {
+      s && d();
+    }), { __sfc: !0, trans: o, editorStore: n, saveAsTemplateStore: t, createTemplate: m, isSaving: a, isAddingOption: r, templateNameError: l, footerButtonGroupOptions: f, closeModal: u, validateTemplateName: i, handleTemplateName: v, handleAddOption: g, handleCategoryChange: y, handleSelectAllOptions: S, handleResetAllOptions: T, saveTemplate: w, focusToInput: p, initializeDrawer: d, WpDrawer: N, InBasicTextInput: M, InMultiSelect: I };
   }
 });
 export {

package/dist/composables/useHtmlCompiler.js

@@ -1,28 +1,30 @@
-import { defaultHtmlCompilerRules as p } from "../config/compiler/htmlCompilerRules.js";
-import { itemsCompilerRules as u } from "../config/compiler/itemsCompilerRules.js";
-import { outlookCompilerRules as c } from "../config/compiler/outlookCompilerRules.js";
-import { recommendationCompilerRules as n } from "../config/compiler/recommendationCompilerRules.js";
-import { socialCompilerRules as f } from "../config/compiler/socialCompilerRules.js";
-import { unsubscribeCompilerRules as R } from "../config/compiler/unsubscribeCompilerRules.js";
-import { createHtmlCompiler as a } from "../utils/htmlCompiler.js";
-import { useConfig as C } from "./useConfig.js";
-const B = () => {
-  var m, l;
-  const { compiler: e } = C(), r = ((m = e.value) == null ? void 0 : m.customRules) || [], t = [
-    ...!!((l = e.value) != null && l.ignoreDefaultRules) ? [] : p,
-    ...n,
-    ...R,
-    ...u,
-    ...c,
+import { defaultHtmlCompilerRules as c } from "../config/compiler/htmlCompilerRules.js";
+import { itemsCompilerRules as f } from "../config/compiler/itemsCompilerRules.js";
+import { liquidCompilerRules as R } from "../config/compiler/liquidCompilerRules.js";
+import { outlookCompilerRules as C } from "../config/compiler/outlookCompilerRules.js";
+import { recommendationCompilerRules as d } from "../config/compiler/recommendationCompilerRules.js";
+import { socialCompilerRules as b } from "../config/compiler/socialCompilerRules.js";
+import { unsubscribeCompilerRules as g } from "../config/compiler/unsubscribeCompilerRules.js";
+import { createHtmlCompiler as H } from "../utils/htmlCompiler.js";
+import { useConfig as v } from "./useConfig.js";
+const w = () => {
+  var l, m, r;
+  const { compiler: e, isFeatureEnabled: t, partner: i } = v(), s = ((l = e.value) == null ? void 0 : l.customRules) || [], u = [
+    ...!!((m = e.value) != null && m.ignoreDefaultRules) ? [] : c,
+    ...d,
+    ...g,
     ...f,
-    ...r.map((o, s) => ({
+    ...C,
+    ...b,
+    ...t("liquidSyntax") ? R : [],
+    ...s.map((o, a) => ({
       ...o,
-      priority: o.priority + 1e3 + s
+      priority: o.priority + 1e3 + a
       // Ensure additional rules run after default rules
     }))
-  ], i = a(t);
-  return { compileHtml: (o) => i.compile(o) };
+  ], p = H(u), n = (r = i.value) == null ? void 0 : r.fallbackFont;
+  return { compileHtml: (o) => p.compile(o, void 0, n) };
 };
 export {
-  B as useHtmlCompiler
+  w as useHtmlCompiler
 };

package/dist/composables/useHtmlValidator.js

@@ -9,76 +9,76 @@ import { useHttp as j } from "./useHttp.js";
 import { useToaster as q } from "./useToaster.js";
 import { useTranslations as z } from "./useTranslations.js";
 const K = /recommendation-id="(\d+)"/g;
-function U(i) {
-  return [...i.matchAll(K)].map((u) => u[1]);
+function U(a) {
+  return [...a.matchAll(K)].map((u) => u[1]);
 }
-function Y(i, u) {
-  return u.some((d) => i.startsWith(`${d}_`));
+function Y(a, u) {
+  return u.some((d) => a.startsWith(`${d}_`));
 }
 const ce = () => {
   var y, h;
-  const { showToaster: i } = q(), { post: u } = j(), { config: d } = L(), r = z(), g = $(), p = ((h = (y = d.value) == null ? void 0 : y.partner) == null ? void 0 : h.messageType) === V.transactional, w = async (e) => {
+  const { showToaster: a } = q(), { post: u } = j(), { config: d } = L(), r = z(), g = $(), p = ((h = (y = d.value) == null ? void 0 : y.partner) == null ? void 0 : h.messageType) === V.transactional, b = async (e) => {
     const t = await u(
       "/newsletter/template-library/check-template-html-body",
       { html: X(e) }
     ), { status: n, message: l } = t.data;
-    return n || i({
+    return n || a({
       type: c.Alert,
       message: n === void 0 ? l : r("newsletter.invalid-url-link-for-toaster")
-    }), r(P), l === r(G) && i({
+    }), r(P), l === r(G) && a({
       type: c.Alert,
       message: r("newsletter.already-in-progress")
     }), n;
-  }, b = (e) => !["if", "endif", "else", "elif", "now"].includes(e.toLowerCase()), S = (e) => ["if", "endif"].includes(e.toLowerCase()), E = (e, s) => {
+  }, w = (e) => !["if", "endif", "else", "elif", "now"].includes(e.toLowerCase()), S = (e) => ["if", "endif"].includes(e.toLowerCase()), E = (e, s) => {
     const t = e.match(/({%(.*?)%})/g);
     let n = !0;
     return t !== null && !p && t.forEach((l) => {
       const o = l.slice(2, -2).trim().match(/(".*?"|[^"\s]+)(?=\s*|\s*$)/g);
       if (o && o.length > 0) {
-        const [a] = o;
-        b(a) && !s.includes(a) && (i({
+        const [i] = o;
+        w(i) && !s.includes(i) && (a({
           type: c.Warning,
           message: r("custom-fields.invalid-custom-fields")
         }), n = !1);
       }
     }), n;
   }, A = async (e, s, t) => {
-    const n = t ? await w(e) : !0;
+    const n = t ? await b(e) : !0;
     return E(e, s) && n;
-  }, I = (e) => e.length > 0 ? !0 : (i({
+  }, I = (e) => e.length > 0 ? !0 : (a({
     type: c.Warning,
     message: r("newsletter.html-content-is-empty")
   }), !1), k = (e) => {
     const s = (e.match(/{/gm) || []).length, t = (e.match(/}/gm) || []).length;
-    return s > t && i({
+    return s > t && a({
       type: c.Warning,
       message: r("custom-fields.missing-closing-braces")
-    }), s < t && i({
+    }), s < t && a({
       type: c.Warning,
       message: r("custom-fields.missing-opening-braces")
     }), s === t;
   }, x = (e) => {
     const s = e.match(/{{\s*(\w+\s+((\w+\|\w+)|(\w+)))\s*}}/gm) === null;
-    return s || i({
+    return s || a({
       type: c.Warning,
       message: r("custom-fields.invalid-custom-fields")
     }), s;
   }, T = (e, s) => {
     const t = e.match(/{{([a-zA-Z0-9_\s]*)}}/gm);
     if (t && !p) {
-      const n = new Set(s.map((a) => a.toLowerCase())), l = U(e), o = [];
-      if (t.forEach((a) => {
-        const m = a.slice(2, -2).trim().toLowerCase();
+      const n = new Set(s.map((i) => i.toLowerCase())), l = U(e), o = [];
+      if (t.forEach((i) => {
+        const m = i.slice(2, -2).trim().toLowerCase();
         (!n.has(m) || m === "") && !Y(m, l) && o.push(m);
       }), o.length > 0) {
-        const a = `
+        const i = `
                     <ul>
                         ${o.map((m) => `<li>${m}</li>`).join("")}
                     </ul>
                 `;
-        return i({
+        return a({
           type: c.Alert,
-          message: r("custom-fields.invalid-custom-fields") + a
+          message: r("custom-fields.invalid-custom-fields") + i
         }), !1;
       }
     }
@@ -87,12 +87,12 @@ const ce = () => {
     const s = e.match(/{%(.*?)%}/g), t = [];
     let n = !0;
     if (s && s.forEach((l) => {
-      const o = l.match(_), a = l.match(H), m = (o == null ? void 0 : o.join("")) || "";
-      (!o || l !== m) && !a && (i({
+      const o = l.match(_), i = l.match(H), m = (o == null ? void 0 : o.join("")) || "";
+      (!o || l !== m) && !i && (a({
         type: c.Alert,
         message: r("newsletter.display-conditions-invalid-syntax")
       }), n = !1), o && o.forEach((f) => {
-        f.trim() === "=" && (i({
+        f.trim() === "=" && (a({
           type: c.Alert,
           message: r("custom-conditions.wrong-equality-operators")
         }), n = !1);
@@ -102,8 +102,8 @@ const ce = () => {
         });
       });
     }), t.length) {
-      const l = t.filter((a) => a === "if"), o = t.filter((a) => a === "endif");
-      l.length !== o.length && (i({
+      const l = t.filter((i) => i === "if"), o = t.filter((i) => i === "endif");
+      l.length !== o.length && (a({
         type: c.Alert,
         message: r("custom-conditions.missing-if-endif-tag")
       }), n = !1);
@@ -111,45 +111,47 @@ const ce = () => {
     return n;
   }, W = (e) => {
     const s = (e.match(/{% /gm) || []).length, t = (e.match(/ %}/gm) || []).length, n = s === t;
-    return n || i({
+    return n || a({
       type: c.Warning,
       message: r("custom-conditions.no-space-after-braces")
     }), n;
-  }, N = (e) => (e.match(/({%(.*?)%})/g) || []).filter((t) => t.includes("if")).map((t) => (t.match(/{{.*}}/gm) || []).length).reduce((t, n) => t + n, 0) > 0 ? (i({
+  }, N = (e) => (e.match(/({%(.*?)%})/g) || []).filter((t) => t.includes("if")).map((t) => (t.match(/{{.*}}/gm) || []).length).reduce((t, n) => t + n, 0) > 0 ? (a({
     type: c.Warning,
     message: r("custom-conditions.no-braces-inside-if-tag")
-  }), !1) : !0, O = () => g.recommendationConfigs && Object.values(g.recommendationConfigs).find((s) => s.filters.find((t) => t.value === "")) !== void 0 ? (i({
+  }), !1) : !0, O = () => g.recommendationConfigs && Object.values(g.recommendationConfigs).find((s) => s.filters.find((t) => t.value === "")) !== void 0 ? (a({
     type: c.Alert,
     message: r("newsletter.fill-all-necessary-fields")
   }), !1) : !0, B = (e) => {
     const s = /src="[^"]*\.(svg|pst)"/gm;
-    return e.match(s) === null ? !0 : (i({
+    return e.match(s) === null ? !0 : (a({
       type: c.Alert,
       message: r("newsletter.invalid-image-type")
     }), !1);
   }, R = (e) => {
     const n = new DOMParser().parseFromString(e, "text/html").querySelectorAll(".checkbox-block-v2");
     return Array.from(n).find((o) => {
-      var a;
-      return !((a = o.id) != null && a.trim());
-    }) ? (i({
+      var i;
+      return !((i = o.id) != null && i.trim());
+    }) ? (a({
       type: c.Alert,
       message: r("unsubscribe-templates.select-checkbox-groups")
     }), !1) : !0;
   }, D = (e) => {
     const n = new DOMParser().parseFromString(e, "text/html").querySelectorAll(".radio-button-v2");
     return Array.from(n).find((o) => {
-      var a;
-      return !((a = o.id) != null && a.trim());
-    }) ? (i({
+      var i;
+      return !((i = o.id) != null && i.trim());
+    }) ? (a({
       type: c.Alert,
       message: r("unsubscribe-templates.select-radio-button-groups")
     }), !1) : !0;
   };
   return { validateHtml: async (e, s, t = !1) => {
+    var o, i;
     const n = [
-      ...s.map((o) => o.value),
-      ...M
+      ...s.map((m) => m.value),
+      ...M,
+      ...((i = (o = d.value) == null ? void 0 : o.template) == null ? void 0 : i.customFieldAttributes) ?? []
     ];
     return await A(e, n, t) && I(e) && k(e) && x(e) && T(e, n) && F(e) && W(e) && N(e) && O() && B(e) && R(e) && D(e);
   } };

package/dist/composables/usePreviewMode.js

@@ -1,31 +1,35 @@
-import { useEditorStore as n } from "../stores/editor.js";
-import { usePreviewStore as l } from "../stores/preview.js";
-import { useActionsApi as m } from "./useActionsApi.js";
-import { useCodeEditorApi as p } from "./useCodeEditorApi.js";
-const E = () => {
-  const o = n(), e = l(), { closeCodeEditor: a } = p(), { getPreviewData: s } = m(), r = () => {
-    o.isPreviewModeOpen = !1, e.$reset();
+import { useEditorStore as d } from "../stores/editor.js";
+import { usePreviewStore as n } from "../stores/preview.js";
+import { useActionsApi as p } from "./useActionsApi.js";
+import { useCodeEditorApi as c } from "./useCodeEditorApi.js";
+import { useHtmlCompiler as u } from "./useHtmlCompiler.js";
+const g = () => {
+  const t = d(), e = n(), { closeCodeEditor: i } = c(), { getPreviewData: a, getCompiledEmail: s } = p(), { compileHtml: m } = u(), r = () => {
+    t.isPreviewModeOpen = !1, e.$reset();
   };
   return {
     closePreviewMode: r,
     openPreviewMode: () => {
-      o.isCodeEditorOpen && a(), o.isPreviewModeOpen = !0;
+      t.isCodeEditorOpen && i(), t.isPreviewModeOpen = !0;
     },
     loadPreviewData: async () => {
-      if (!(o.loadingStatus || e.isLoaded)) {
-        o.loadingStatus = !0;
+      if (!(t.loadingStatus || e.isLoaded)) {
+        t.loadingStatus = !0;
         try {
-          const { html: t, ampHtml: i, ampErrors: d } = await s();
-          e.templateHtml = t || "", e.ampHtml = i || "", e.ampErrors = d || [], e.setEmailFormat(i ? "AMP" : "html"), e.isLoaded = !0;
-        } catch (t) {
-          console.error("Failed to load preview data:", t), r();
+          const [o, l] = await Promise.all([
+            a(),
+            s({ minimize: !0, resetDataSavedFlag: !1 })
+          ]);
+          e.templateHtml = o.html || "", e.ampHtml = o.ampHtml || "", e.ampErrors = o.ampErrors || [], e.setEmailFormat(o.ampHtml ? "AMP" : "html"), e.emailSizeKB = m(l.html).estimatedSizeKB, e.isLoaded = !0;
+        } catch (o) {
+          console.error("Failed to load preview data:", o), r();
         } finally {
-          o.loadingStatus = !1;
+          t.loadingStatus = !1;
         }
       }
     }
   };
 };
 export {
-  E as usePreviewMode
+  g as usePreviewMode
 };

package/dist/composables/useSave.js

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