@useinsider/guido 1.0.0-beta.e40480e → 1.0.0-beta.e415f9e

package/dist/composables/useExport.js

@@ -1,30 +1,45 @@
 import { useActionsApi as l } from "./useActionsApi.js";
-import { useToaster as m } from "./useToaster.js";
-const u = () => {
-  const a = (r, t, e) => {
-    const n = new Blob([r], { type: e }), s = URL.createObjectURL(n), o = document.createElement("a");
-    o.href = s, o.download = t, document.body.appendChild(o), o.click(), document.body.removeChild(o), URL.revokeObjectURL(s);
-  }, c = (r) => {
-    const t = /* @__PURE__ */ new Date(), e = String(t.getDate()).padStart(2, "0"), n = String(t.getMonth() + 1).padStart(2, "0"), s = t.getFullYear(), o = String(t.getHours()).padStart(2, "0"), i = String(t.getMinutes()).padStart(2, "0");
-    return `${r}_${e}-${n}-${s}_${o}-${i}.html`;
+import { useHtmlCompiler as m } from "./useHtmlCompiler.js";
+import { useToaster as d } from "./useToaster.js";
+const h = () => {
+  const a = (s, o, r) => {
+    const i = new Blob([s], { type: r }), t = URL.createObjectURL(i), e = document.createElement("a");
+    e.href = t, e.download = o, document.body.appendChild(e), e.click(), document.body.removeChild(e), URL.revokeObjectURL(t);
+  }, c = (s) => {
+    const o = /* @__PURE__ */ new Date(), r = String(o.getDate()).padStart(2, "0"), i = String(o.getMonth() + 1).padStart(2, "0"), t = o.getFullYear(), e = String(o.getHours()).padStart(2, "0"), n = String(o.getMinutes()).padStart(2, "0");
+    return `${s}_${r}-${i}-${t}_${e}-${n}.html`;
   };
-  return { exportHtml: async () => {
-    const { getCompiledEmail: r } = l(), { showToaster: t } = m();
+  return { exportHtml: async (s = !0) => {
+    const { getCompiledEmail: o } = l(), { showToaster: r } = d(), { compileHtml: i } = m();
     try {
-      const { html: e } = await r();
-      e ? a(e, c("HTML"), "text/html") : t({
+      const { html: t } = await o();
+      if (t) {
+        let e = t;
+        if (s) {
+          const n = i(t);
+          e = n.compiledHtml, console.debug("HTML Compilation Stats:", {
+            originalSize: n.stats.originalSize,
+            compiledSize: n.stats.compiledSize,
+            reduction: `${n.stats.reductionPercentage.toFixed(2)}%`,
+            appliedRules: n.appliedRules,
+            executionTime: `${n.stats.executionTime.toFixed(2)}ms`
+          });
+        }
+        a(e, c("HTML"), "text/html");
+      } else
+        r({
+          type: "error",
+          message: "No HTML content to download"
+        });
+    } catch (t) {
+      const e = t instanceof Error ? t.message : String(t);
+      r({
         type: "error",
-        message: "No HTML content to download"
-      });
-    } catch (e) {
-      const n = e instanceof Error ? e.message : String(e);
-      t({
-        type: "error",
-        message: `Error compiling email: ${n}`
+        message: `Error compiling email: ${e}`
       });
     }
   } };
 };
 export {
-  u as useExport
+  h as useExport
 };

package/dist/composables/useHtmlCompiler.d.ts

@@ -0,0 +1,4 @@
+import type { CompilationResult } from '@@/Types/html-compiler';
+export declare const useHtmlCompiler: () => {
+    compileHtml: (html: string) => CompilationResult;
+};

package/dist/composables/useHtmlCompiler.js

@@ -0,0 +1,16 @@
+import { defaultHtmlCompilerRules as r } from "../config/compiler/htmlCompilerRules.js";
+import { createHtmlCompiler as p } from "../utils/htmlCompiler.js";
+const a = () => {
+  const e = typeof window < "u" ? window.GuidoConfig : void 0, l = (e == null ? void 0 : e.htmlCompilerRules) || [], t = [
+    ...!!(e != null && e.ignoreDefaultHtmlCompilerRules) ? [] : r,
+    ...l.map((o, m) => ({
+      ...o,
+      priority: o.priority + 1e3 + m
+      // Ensure additional rules run after default rules
+    }))
+  ], i = p(t);
+  return { compileHtml: (o) => i.compile(o) };
+};
+export {
+  a as useHtmlCompiler
+};

package/dist/composables/useHttp.js

@@ -0,0 +1,84 @@
+import { ref as p, computed as v } from "vue";
+const j = (y = {}) => {
+  const h = p(!1), a = p(null), u = p(null), E = v(() => h.value), g = v(() => a.value !== null), T = {
+    baseURL: "",
+    timeout: 1e4,
+    retry: 0,
+    retryDelay: 1e3,
+    headers: {
+      "Content-Type": "application/json"
+    },
+    ...y
+  }, w = (e, s) => {
+    if (e.startsWith("http://") || e.startsWith("https://"))
+      return e;
+    const t = s || T.baseURL || "";
+    return t.endsWith("/") && e.startsWith("/") ? `${t}${e.slice(1)}` : t.endsWith("/") || e.startsWith("/") ? `${t}${e}` : `${t}/${e}`;
+  }, P = (e) => new Promise((s, t) => {
+    setTimeout(() => {
+      t(new Error("Request timeout"));
+    }, e);
+  }), x = (e) => new Promise((s) => {
+    setTimeout(s, e);
+  }), i = async (e, s, t, D = {}) => {
+    a.value = null, h.value = !0, u.value = new AbortController();
+    const n = { ...T, ...D }, L = w(s, n.baseURL), c = {
+      method: e,
+      headers: { ...n.headers },
+      signal: u.value.signal,
+      ...n
+    };
+    t && ["POST", "PUT", "PATCH"].includes(e) && (t instanceof FormData ? (delete c.headers["Content-Type"], c.body = t) : c.body = JSON.stringify(t));
+    const b = async (m = 0) => {
+      try {
+        const o = [fetch(L, c)];
+        n.timeout && o.push(P(n.timeout));
+        const r = await Promise.race(o);
+        if (!r.ok) {
+          const H = `HTTP Error: ${r.status} ${r.statusText}`, d = new Error(H);
+          throw d.status = r.status, d.statusText = r.statusText, d.response = r, d;
+        }
+        let f;
+        const l = r.headers.get("content-type");
+        return l != null && l.includes("application/json") ? f = await r.json() : l != null && l.includes("text/") ? f = await r.text() : f = await r.blob(), {
+          data: f,
+          status: r.status,
+          statusText: r.statusText,
+          headers: r.headers
+        };
+      } catch (o) {
+        const r = o instanceof Error && o.name === "AbortError";
+        if (m < (n.retry || 0) && !r)
+          return await x(n.retryDelay || 1e3), b(m + 1);
+        throw o instanceof Error ? o.name === "AbortError" ? a.value = { message: "Request was cancelled" } : a.value = { message: o.message } : a.value = o, o;
+      }
+    };
+    try {
+      return await b();
+    } finally {
+      h.value = !1, u.value = null;
+    }
+  }, $ = (e, s) => i("GET", e, void 0, s), C = (e, s, t) => i("POST", e, s, t), U = (e, s, t) => i("PUT", e, s, t), A = (e, s, t) => i("PATCH", e, s, t), R = (e, s) => i("DELETE", e, void 0, s), W = (e) => {
+    u.value && u.value.abort(e);
+  }, q = () => {
+    a.value = null;
+  };
+  return {
+    // State
+    loading: E,
+    error: v(() => a.value),
+    hasError: g,
+    // Methods
+    request: i,
+    get: $,
+    post: C,
+    put: U,
+    patch: A,
+    delete: R,
+    cancel: W,
+    clearError: q
+  };
+};
+export {
+  j as useHttp
+};

package/dist/composables/usePartner.d.ts

@@ -0,0 +1,4 @@
+export declare const usePartner: () => {
+    getPartnerName: () => string;
+    getProductType: () => string;
+};

package/dist/composables/usePartner.js

@@ -0,0 +1,16 @@
+import { DefaultProductType as o } from "../enums/defaults.js";
+const p = () => {
+  const e = {
+    email: "newsletter"
+  };
+  return {
+    getPartnerName: () => window.location.hostname.split(".")[0] || "",
+    getProductType: () => {
+      const t = window.location.pathname.split("/").filter(Boolean)[0] || o;
+      return e[t] || t;
+    }
+  };
+};
+export {
+  p as usePartner
+};

package/dist/composables/useStripo.d.ts

@@ -1,4 +1,4 @@
-import type { Template } from '@@/Types/stripo';
-export declare const useStripo: (emailId: string) => {
+import type { Metadata, Template } from '@@/Types/stripo';
+export declare const useStripo: (metadata: Metadata) => {
     initPlugin: (template: Template) => Promise<void>;
 };

package/dist/composables/useStripo.js

@@ -1,83 +1,91 @@
-import { useCustomInterfaceAppearance as u } from "./useCustomInterfaceAppearance.js";
-import { useEditorStore as a } from "../stores/editor.js";
-const g = (s) => {
-  const c = () => {
-    const t = new Headers();
-    t.append("Content-Type", "application/json");
-    const r = JSON.stringify({
-      pluginId: void 0,
-      secretKey: void 0,
-      role: void 0,
-      userId: s
-    });
-    return fetch("/v2/stripo/get-user-token", {
-      method: "POST",
-      headers: t,
-      body: r,
-      redirect: "follow"
-    }).then((o) => o.json());
-  }, d = (t) => {
-    const r = a(), i = t.html, o = t.css;
+import { useActionsApi as m } from "./useActionsApi.js";
+import { useCustomInterfaceAppearance as g } from "./useCustomInterfaceAppearance.js";
+import { useToaster as f } from "./useToaster.js";
+import { displayConditions as E } from "../enums/displayConditions.js";
+import S from "../extensions/DynamicContent/extension.js";
+import { useStripoApi as y } from "../services/stripoApi.js";
+import { useEditorStore as C } from "../stores/editor.js";
+const x = (a) => {
+  const { handleError: d } = f(), { getToken: c, getCustomFonts: u } = y(), l = (e, r = []) => {
+    const i = C(), { html: t, css: s } = e;
     window.UIEditor.initEditor(
       document.querySelector("#guido-editor"),
       {
-        metadata: {
-          emailId: s,
-          userId: "1",
-          username: "Guido User"
-        },
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-        html: i,
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-        css: o,
+        metadata: a,
+        html: t,
+        css: s,
+        forceRecreate: !0,
         locale: "en",
         undoButtonSelector: "#guido__undo-button",
         redoButtonSelector: "#guido__redo-button",
         mobileViewButtonSelector: ".guido__view-option-selection-mobile",
         desktopViewButtonSelector: ".guido__view-option-selection-desktop",
         codeEditorButtonSelector: "#guido__code-button",
-        async onTokenRefreshRequest(e) {
+        customAppearanceMergetags: !0,
+        customAppearanceMergetagsBorderColor: "#f1f3fe",
+        customAppearanceMergetagsBackgroundColor: "#f1f3fe",
+        customViewStyles: `
+                    .esd-x, .esd-merge-tag {color: #0a2ecc !important; box-shadow: none !important;} 
+                    .esd-merge-tag {border: 1px solid #b5c1f1; border-radius: 4px !important;}
+                `,
+        conditionsEnabled: !0,
+        customConditionsEnabled: !0,
+        conditionCategories: E,
+        messageSettingsEnabled: !1,
+        editorFonts: {
+          showDefaultStandardFonts: !0,
+          showDefaultNotStandardFonts: !0,
+          customFonts: r
+        },
+        async onTokenRefreshRequest(o) {
           try {
             const n = await c();
-            e(n.token);
+            o(n);
           } catch (n) {
-            console.error("Failed to refresh token:", n);
+            d(n, "Failed to refresh token");
           }
         },
         onTemplateLoaded() {
           try {
-            const { importCss: e } = u();
-            e();
-          } catch (e) {
-            console.error("Failed to load custom interface appearance:", e);
+            const { importCss: o } = g(), { activateCustomViewStyles: n } = m();
+            o(), n();
+          } catch (o) {
+            d(o, "Failed to load custom interface appearance");
           }
         },
-        onCodeEditorVisibilityChanged(e) {
-          r.isCodeEditorOpen = e;
+        onCodeEditorVisibilityChanged(o) {
+          i.isCodeEditorOpen = o;
         },
-        onEditorVisualModeChanged(e) {
-          r.editorVisualMode = e.toLowerCase();
+        onEditorVisualModeChanged(o) {
+          i.editorVisualMode = o.toLowerCase();
         },
-        onVersionHistoryVisibilityChanged(e) {
-          r.isVersionHistoryOpen = e;
-        }
+        onVersionHistoryVisibilityChanged(o) {
+          i.isVersionHistoryOpen = o;
+        },
+        ignoreClickOutsideSelectors: ["#guido-dynamic-content-modal"],
+        extensions: [S]
       }
     );
-  };
-  return { initPlugin: (t) => new Promise((r, i) => {
+  }, p = (e) => new Promise((r, i) => {
     if (document.getElementById("UiEditorScript")) {
-      d(t), r();
+      e(), r();
       return;
     }
-    const o = document.createElement("script");
-    o.id = "UiEditorScript", o.type = "module", o.src = "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js", o.onload = () => {
-      d(t), r();
-    }, o.onerror = () => {
-      const e = new Error("Failed to load Stripo UIEditor script");
-      i(e);
-    }, document.body.appendChild(o);
-  }) };
+    const t = document.createElement("script");
+    t.id = "UiEditorScript", t.type = "module", t.src = "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js", t.onload = () => {
+      e(), r();
+    }, t.onerror = () => {
+      const s = new Error("Failed to load Stripo UIEditor script");
+      i(s);
+    }, document.body.appendChild(t);
+  });
+  return { initPlugin: async (e) => {
+    await p(async () => {
+      const r = await u();
+      l(e, r);
+    });
+  } };
 };
 export {
-  g as useStripo
+  x as useStripo
 };

package/dist/composables/useToaster.d.ts

@@ -17,4 +17,5 @@ export declare const useToaster: () => {
     } | undefined)[]>;
     showToaster: (options?: ToasterOptions) => void;
     hideToaster: () => void;
+    handleError: (error: unknown, context: string) => void;
 };

package/dist/composables/useToaster.js

@@ -1,29 +1,37 @@
-import { ref as u, watch as f } from "vue";
-const T = () => {
-  const t = u(!1), s = u(""), r = u("success"), o = u([]);
+import { ref as o, watch as T } from "vue";
+const v = () => {
+  const t = o(!1), s = o(""), c = o("success"), n = o([]);
   let a = null;
-  function l() {
+  function i() {
     a && (clearTimeout(a), a = null);
   }
-  function c() {
-    t.value = !1, o.value = [], s.value = "";
+  function u() {
+    t.value = !1, n.value = [], s.value = "";
   }
-  function n(e = { message: "" }) {
-    c(), s.value = e.message, r.value = e.type || "success", o.value = e.actionButton ? [e.actionButton] : [], t.value = !0;
+  function l(e = { message: "" }) {
+    u(), s.value = e.message, c.value = e.type || "success", n.value = e.actionButton ? [e.actionButton] : [], t.value = !0;
   }
-  return f([t, s], ([e, i]) => {
-    l(), e && i && (a = setTimeout(() => {
-      c();
+  function f(e, r) {
+    const m = e instanceof Error ? e.message : String(e);
+    l({
+      type: "error",
+      message: `${r}: ${m}`
+    });
+  }
+  return T([t, s], ([e, r]) => {
+    i(), e && r && (a = setTimeout(() => {
+      u();
     }, 6e3));
   }), {
     isToasterVisible: t,
     toasterMessage: s,
-    toasterType: r,
-    toasterActionButton: o,
-    showToaster: n,
-    hideToaster: c
+    toasterType: c,
+    toasterActionButton: n,
+    showToaster: l,
+    hideToaster: u,
+    handleError: f
   };
 };
 export {
-  T as useToaster
+  v as useToaster
 };

package/dist/config/compiler/htmlCompilerRules.d.ts

@@ -0,0 +1,2 @@
+import type { CompilerRule } from '@@/Types/html-compiler';
+export declare const defaultHtmlCompilerRules: CompilerRule[];

package/dist/config/compiler/htmlCompilerRules.js

@@ -0,0 +1,145 @@
+const a = [
+  {
+    id: "fix-url-encoding-start",
+    description: "Replace {%22 with %7B%22 to fix URL encoding",
+    type: "replace",
+    search: "{%22",
+    replacement: "%7B%22",
+    replaceAll: !0,
+    priority: 10
+  },
+  {
+    id: "fix-url-encoding-end",
+    description: "Replace %22} with %22%7D to fix URL encoding",
+    type: "replace",
+    search: "%22}",
+    replacement: "%22%7D",
+    replaceAll: !0,
+    priority: 10
+  },
+  {
+    id: "fix-tags-start",
+    description: "Replace %7B%7B with {{ to fix URL encoding",
+    type: "replace",
+    search: "%7B%7B",
+    replacement: "{{",
+    replaceAll: !0,
+    priority: 11
+  },
+  {
+    id: "fix-tags-end",
+    description: "Replace %7D%7D with }} to fix URL encoding",
+    type: "replace",
+    search: "%7D%7D",
+    replacement: "}}",
+    replaceAll: !0,
+    priority: 12
+  },
+  {
+    id: "unescape-inequality-operators-start",
+    description: "Replace &lt; with < to fix URL encoding",
+    type: "replace",
+    search: "&lt;",
+    replacement: "<",
+    replaceAll: !0,
+    priority: 13
+  },
+  {
+    id: "unescape-inequality-operators-end",
+    description: "Replace &gt; with > to fix URL encoding",
+    type: "replace",
+    search: "&gt;",
+    replacement: ">",
+    replaceAll: !0,
+    priority: 14
+  },
+  {
+    id: "remove-apty-iframe",
+    description: "Cleanup Apty Iframe Code",
+    type: "remove",
+    targets: [
+      '<iframe src="about:blank" id="letznav-iframe-script" allowtransparency="true" style="width:1px;height:1px"></iframe>',
+      'src="about:blank" id="letznav-iframe-script" allowtransparency="true" style="width:1px;height:1px"></iframe>'
+    ],
+    priority: 20
+  },
+  {
+    id: "remove-apty-styles",
+    description: "Removing Apty Styles",
+    type: "regex",
+    pattern: '<styles*data-styles="apty_styles"s* type="text/css"s*>((s|.)*?)</style>',
+    replacement: "",
+    flags: "g",
+    priority: 21
+  },
+  {
+    id: "remove-mso-conditions",
+    description: "Removing MSO Conditions",
+    type: "remove",
+    targets: [
+      /<!--\[if\s\(mso 16\)\]>\s*<style\s*\S*>\s*a\s*\{\s*text-decoration\s*:\s*none\s*;*\s*\}\s*<\/style>\s*<!\[endif\]-->/g,
+      /<!--\[if\sgte mso 9\]>\s*<style\s*\S*>\s*sup\s*\{\s*font-size\s*:\s*100%\s*!important\s*;*\s*\}\s*<\/style>\s*<!\[endif\]-->/g,
+      /<!--\[if\sgte mso 9\]>\s*<noscript>\s*<xml>\s*<o:OfficeDocumentSettings>\s*<o:AllowPNG>\s*<\/o:AllowPNG>\s*<o:PixelsPerInch>\d+<\/o:PixelsPerInch>\s*<\/o:OfficeDocumentSettings>\s*<\/xml>\s*<\/noscript>\s*<!\[endif\]-->/g,
+      /<!--\[if mso\]>\s*<xml>\s*<w:WordDocument\s+xmlns:w="urn:schemas-microsoft-com:office:word">\s*<w:DontUseAdvancedTypographyReadingMail><\/w:DontUseAdvancedTypographyReadingMail>\s*<\/w:WordDocument>\s*<\/xml>\s*<!\[endif\]-->/g,
+      /<\!--\[if \!mso\]><\!--\s*\d*\s*-->\s*<\!--\[if \!mso\]><\!--\s*\d*\s*-->\s*<\!--<!\[endif\]-->/g,
+      /<!--\[if\s\!mso\]>\s*<!-- \d -->/g
+    ],
+    priority: 22
+  },
+  {
+    id: "add-mso-conditions",
+    description: "Adding MSO Conditions",
+    type: "custom",
+    processor: (e) => {
+      const t = [
+        `<!--[if gte mso 9]>
+<style>sup {
+    font-size: 100% !important;
+}</style><![endif]-->`,
+        `<!--[if gte mso 9]>
+<noscript>
+    <xml>
+        <o:OfficeDocumentSettings>
+            <o:AllowPNG></o:AllowPNG>
+            <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+    </xml>
+</noscript><![endif]-->`,
+        `<!--[if mso]>
+<xml>
+    <w:WordDocument xmlns:w="urn:schemas-microsoft-com:office:word">
+        <w:DontUseAdvancedTypographyReadingMail></w:DontUseAdvancedTypographyReadingMail>
+    </w:WordDocument>
+</xml><![endif]-->`
+      ], s = /<head>([\S\s]*)<\/head>/, o = new RegExp(s);
+      if (!e.match(o))
+        return e;
+      let i = e;
+      return t.forEach((r) => {
+        i = i.replace("</head>", `${r}</head>`);
+      }), i;
+    },
+    priority: 30
+  },
+  {
+    id: "replace-old-image-domain",
+    description: "Replacing old image domains",
+    type: "replace",
+    search: "stripo-editor-image.s3-eu-west-1.amazonaws.com",
+    replacement: "email-static.useinsider.com",
+    replaceAll: !0,
+    priority: 40
+  },
+  {
+    id: "replace-old-v2-image-domain",
+    description: "Replacing old image domains",
+    type: "replace",
+    search: "email.static.useinsider.com",
+    replacement: "email-static.useinsider.com",
+    replaceAll: !0,
+    priority: 41
+  }
+];
+export {
+  a as defaultHtmlCompilerRules
+};

package/dist/enums/defaults.d.ts

@@ -1,2 +1,4 @@
 import type { GuidoConfig } from '@@/Types/generic';
 export declare const DefaultGuidoConfig: GuidoConfig;
+export declare const DefaultProductType = "newsletter";
+export declare const DefaultUsername = "Guido User";

package/dist/enums/defaults.js

@@ -1,6 +1,8 @@
-const n = {
+const t = {
   translationsPath: "window.trans.en"
-};
+}, e = "newsletter", n = "Guido User";
 export {
-  n as DefaultGuidoConfig
+  t as DefaultGuidoConfig,
+  e as DefaultProductType,
+  n as DefaultUsername
 };

package/dist/enums/displayConditions.d.ts

@@ -0,0 +1,2 @@
+import type { ConditionCategories } from '@@/Types/condition-categories';
+export declare const displayConditions: ConditionCategories;