@useinsider/guido 3.1.0 → 3.1.1-beta.0220fb9

package/dist/stores/toaster.js

@@ -1,27 +1,27 @@
-import { ToasterTypeOptions as s } from "../enums/toaster.js";
+import { ToasterTypeOptions as e } from "../enums/toaster.js";
 import { defineStore as i } from "pinia";
 const a = () => ({
   status: !1,
-  type: s.Success,
+  type: e.Success,
   text: "",
   icon: "",
   withIcon: !0,
   withoutLeftMargin: !1,
   actionButton: void 0
-}), u = i("guidoToaster", {
+}), n = i("guidoToaster", {
   state: () => a(),
   getters: {
     shouldAutoHide: (t) => t.status && !!t.text
   },
   actions: {
-    showToaster({ type: t = s.Success, message: e, actionButton: o }) {
-      this.status = !0, this.text = e, this.type = t, this.actionButton = o;
+    showToaster({ type: t = e.Success, message: s, actionButton: o }) {
+      this.status = !0, this.text = s, this.type = t, this.actionButton = o;
     },
     hideToaster() {
-      this.status = !1, this.text = "", this.actionButton = void 0;
+      this.status = !1;
     }
   }
 });
 export {
-  u as useToasterStore
+  n as useToasterStore
 };

package/dist/utils/htmlCompiler.js

@@ -1,70 +1,77 @@
-var y = Object.defineProperty;
-var g = (p, e, r) => e in p ? y(p, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : p[e] = r;
-var u = (p, e, r) => g(p, typeof e != "symbol" ? e + "" : e, r);
-import { useToaster as m } from "../composables/useToaster.js";
-class d {
+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 = []) {
-    u(this, "rules");
+    m(this, "rules");
     this.rules = e;
   }
-  compile(e, r) {
-    const l = performance.now(), t = e, o = e.length;
+  compile(e, t, r) {
+    const n = performance.now(), l = e, c = e.length;
     let s = e;
-    const a = [];
-    (r || this.rules).sort((n, c) => n.priority - c.priority).forEach((n) => {
-      const c = s.length;
-      s = this.applyRule(s, n), s.length !== c && a.push(n.id);
+    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 i = s.length, R = o > 0 ? (o - i) / o * 100 : 0;
+    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: t,
+      originalHtml: l,
       compiledHtml: s,
-      appliedRules: a,
-      // TODO: We can use stats for monitoring in the future
+      appliedRules: i,
+      estimatedSizeKB: g,
       stats: {
-        originalSize: o,
-        compiledSize: i,
+        originalSize: c,
+        compiledSize: u,
         reductionPercentage: R,
-        executionTime: performance.now() - l
+        executionTime: performance.now() - n
       }
     };
   }
-  applyRule(e, r) {
+  applyRule(e, t) {
     try {
-      switch (r.type) {
+      switch (t.type) {
         case "replace":
-          return this.applyReplaceRule(e, r);
+          return this.applyReplaceRule(e, t);
         case "regex":
-          return this.applyRegexRule(e, r);
+          return this.applyRegexRule(e, t);
         case "remove":
-          return this.applyRemoveRule(e, r);
+          return this.applyRemoveRule(e, t);
         case "custom":
-          return this.applyCustomRule(e, r);
+          return this.applyCustomRule(e, t);
         default:
           return e;
       }
-    } catch (l) {
-      const { handleError: t } = m();
-      return t(l, `Failed to apply rule ${r.id}:`), e;
+    } catch (r) {
+      const { handleError: n } = x();
+      return n(r, `Failed to apply rule ${t.id}:`), e;
     }
   }
-  applyReplaceRule(e, r) {
-    const { search: l, replacement: t, replaceAll: o = !0 } = r;
-    return o ? e.replaceAll(l, t) : e.replace(l, t);
+  applyReplaceRule(e, t) {
+    const { search: r, replacement: n, replaceAll: l = !0 } = t;
+    return l ? e.replaceAll(r, n) : e.replace(r, n);
   }
-  applyRegexRule(e, r) {
-    const { pattern: l, replacement: t, flags: o = "g" } = r, s = new RegExp(l, o);
-    return e.replace(s, t);
+  applyRegexRule(e, t) {
+    const { pattern: r, replacement: n, flags: l = "g" } = t, c = new RegExp(r, l);
+    return e.replace(c, n);
   }
-  applyRemoveRule(e, r) {
-    return r.targets.reduce((l, t) => t instanceof RegExp ? l.replace(t, "") : l.replaceAll(t, ""), e);
+  applyRemoveRule(e, t) {
+    return t.targets.reduce((r, n) => n instanceof RegExp ? r.replace(n, "") : r.replaceAll(n, ""), e);
   }
-  applyCustomRule(e, r) {
-    return r.processor(e);
+  applyCustomRule(e, t) {
+    return t.processor(e);
   }
 }
-const A = (p = []) => new d(p);
+const H = (o = []) => new T(o);
 export {
-  d as HtmlCompilerEngine,
-  A as createHtmlCompiler
+  T as HtmlCompilerEngine,
+  H as createHtmlCompiler
 };

package/dist/utils/templatePreparation.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "3.1.0",
+  "version": "3.1.1-beta.0220fb9",
   "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",
@@ -32,7 +32,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@stripoinc/ui-editor-extensions": "3.5.0",
+    "@stripoinc/ui-editor-extensions": "3.7.0",
     "@useinsider/design-system-vue": "0.14.28",
     "@vueuse/core": "11.3.0",
     "lodash-es": "4.17.21",
@@ -86,7 +86,7 @@
   },
   "guido": {
     "stripo": {
-      "version": "2.54.0"
+      "version": "2.60.0"
     }
   }
 }