@useinsider/guido 1.0.3-beta.49f18d1 → 1.0.3-beta.4a63a85

package/README.md

@@ -600,9 +600,6 @@ Create a `.env` file with the following variables: (You can get env variables fr
 VITE_STRIPO_PLUGIN_ID=your_plugin_id
 VITE_STRIPO_SECRET_KEY=your_secret_key
 VITE_STRIPO_ROLE=your_role
-
-# Playwright Test Configuration (Optional - for local debugging only)
-HEADED=false  # Set to 'true' to run tests with visible browser
 ```
 
 ### Project Structure

package/dist/composables/useActionsApi.js

@@ -1,6 +1,6 @@
-import { useToaster as g } from "./useToaster.js";
+import { useToaster as w } from "./useToaster.js";
 const A = () => {
-  const { handleError: l } = g(), n = (t = {}) => new Promise((e, a) => {
+  const { handleError: l } = w(), s = (e = {}) => new Promise((t, a) => {
     const i = { ...{
       minimize: !0,
       utmEntity: {
@@ -20,13 +20,13 @@ const A = () => {
       forceAmp: !1,
       resetDataSavedFlag: !1,
       disableLineHeightsReplace: !0
-    }, ...t }, m = {
-      callback: (s, c, p, u, d) => {
-        s ? a(s) : e({
-          html: c,
-          ampHtml: p,
-          ampErrors: u,
-          displayConditions: d
+    }, ...e }, m = {
+      callback: (n, p, c, d, u) => {
+        n ? a(n) : t({
+          html: p,
+          ampHtml: c,
+          ampErrors: d,
+          displayConditions: u
         });
       },
       ...i
@@ -34,44 +34,53 @@ const A = () => {
     window.StripoEditorApi.actionsApi.compileEmail(m);
   });
   return {
-    getCompiledEmail: n,
-    getTemplateData: () => new Promise((t) => {
-      const e = ({ html: a, css: o, width: i, height: r, utmParams: m, syncModulesIds: s }) => t({
+    getCompiledEmail: s,
+    getTemplateData: () => new Promise((e) => {
+      const t = ({ html: a, css: o, width: i, height: r, utmParams: m, syncModulesIds: n }) => e({
         html: a,
         css: o,
         width: i,
         height: r,
         utmParams: m,
-        syncModulesIds: s
+        syncModulesIds: n
       });
-      window.StripoEditorApi.actionsApi.getTemplateData(e);
+      window.StripoEditorApi.actionsApi.getTemplateData(t);
     }),
-    activateCustomViewStyles: (t = !0) => {
-      window.StripoEditorApi.actionsApi.activateCustomViewStyles(t);
+    activateCustomViewStyles: (e = !0) => {
+      window.StripoEditorApi.actionsApi.activateCustomViewStyles(e);
     },
-    getPreviewData: async (t) => {
+    getPreviewData: async (e) => {
       try {
         const {
-          html: e,
+          html: t,
           displayConditions: a,
           ampHtml: o = "",
           ampErrors: i = []
-        } = await n({ minimize: !1, resetDataSavedFlag: !1, ...t });
+        } = await s({ minimize: !1, resetDataSavedFlag: !1, ...e });
         return {
-          html: e,
+          html: t,
           ampHtml: o,
           ampErrors: i,
           displayConditions: a
         };
-      } catch (e) {
-        return l(e, "Error loading preview"), {
+      } catch (t) {
+        return l(t, "Error loading preview"), {
           html: "",
           ampHtml: "",
           ampErrors: [],
           displayConditions: []
         };
       }
-    }
+    },
+    updateTimerInClonedTemplate: () => new Promise((e) => {
+      try {
+        window.StripoEditorApi.actionsApi.updateTimerInClonedTemplate((t, a) => {
+          t ? (l(t, "Failed to update timer in cloned template"), e(null)) : e(a || null);
+        });
+      } catch (t) {
+        l(t, "Failed to call updateTimerInClonedTemplate"), e(null);
+      }
+    })
   };
 };
 export {

package/dist/composables/useSave.js

@@ -1,15 +1,20 @@
-import { useSaveStart as i, useSaveComplete as m } from "./useGuidoActions.js";
-import { useTemplatePreparation as n } from "../utils/templatePreparation.js";
-import { useHtmlValidator as l } from "./useHtmlValidator.js";
-const f = () => {
-  const e = i(), a = m(), { validateHtml: s } = l();
-  return { save: async (o = !1) => {
-    e();
-    const { prepareTemplateDetails: r } = n(), t = await r();
-    if (await s(t.compiledHtml, t.dynamicContentList, !0))
-      return o || a(t), t;
+import { useSaveStart as l, useSaveComplete as c } from "./useGuidoActions.js";
+import { useTemplatePreparation as d } from "../utils/templatePreparation.js";
+import { useHtmlValidator as p } from "./useHtmlValidator.js";
+import { useTimerClone as u } from "./useTimerClone.js";
+const g = () => {
+  const t = l(), a = c(), { validateHtml: r } = p(), { cloneTimersOnSave: i } = u();
+  return { save: async (s = !1) => {
+    t();
+    const { prepareTemplateDetails: o } = d(), e = await o();
+    if (!await r(e.compiledHtml, e.dynamicContentList, !0))
+      return;
+    const m = e.rawHtml.match(/esd-timer-id="(\d+)"/g);
+    e.rawHtml = await i(e.rawHtml);
+    const n = e.rawHtml.match(/esd-timer-id="(\d+)"/g);
+    return console.debug("[SAVE] Timer IDs - Original:", m, "New:", n), s || a(e), e;
   } };
 };
 export {
-  f as useSave
+  g as useSave
 };

package/dist/composables/useStripo.js

@@ -1,25 +1,26 @@
-import { useActionsApi as w } from "./useActionsApi.js";
-import { useBlocksConfig as b } from "./useBlocksConfig.js";
-import { useConfig as k } from "./useConfig.js";
-import { useCustomInterfaceAppearance as V } from "./useCustomInterfaceAppearance.js";
-import { useStripoEventHandler as _ } from "./useStripoEventHandler.js";
-import { useToaster as B } from "./useToaster.js";
-import { displayConditions as T } from "../enums/displayConditions.js";
-import { useStripoApi as A } from "../services/stripoApi.js";
-import F from "../static/styles/customEditorStyle.css.js";
-import { useEditorStore as M } from "../stores/editor.js";
-import { dynamicContentToMergeTags as U } from "../utils/genericUtil.js";
-import v from "../package.json.js";
-const J = (c) => {
-  const { config: u } = k(), { handleError: l } = B(), { getToken: f, getCustomFonts: y } = A(), { handleEvent: S } = _(), { getStripoBlocksConfig: C } = b(), E = async (i, r = []) => {
-    var m, g;
-    const t = M(), { html: n, css: p, forceRecreate: a } = i, { baseBlocks: e, extensions: d } = await C();
+import { useActionsApi as V } from "./useActionsApi.js";
+import { useBlocksConfig as _ } from "./useBlocksConfig.js";
+import { useConfig as A } from "./useConfig.js";
+import { useCustomInterfaceAppearance as B } from "./useCustomInterfaceAppearance.js";
+import { useStripoEventHandler as v } from "./useStripoEventHandler.js";
+import { useTimerClone as F } from "./useTimerClone.js";
+import { useToaster as I } from "./useToaster.js";
+import { displayConditions as M } from "../enums/displayConditions.js";
+import { useStripoApi as U } from "../services/stripoApi.js";
+import D from "../static/styles/customEditorStyle.css.js";
+import { useEditorStore as P } from "../stores/editor.js";
+import { dynamicContentToMergeTags as H } from "../utils/genericUtil.js";
+import O from "../package.json.js";
+const Y = (c) => {
+  const { config: u } = A(), { handleError: p } = I(), { getToken: m, getCustomFonts: C } = U(), { handleEvent: S } = v(), { getStripoBlocksConfig: E } = _(), w = async (i, r = []) => {
+    var g, y;
+    const e = P(), { html: s, css: f, forceRecreate: a } = i, { baseBlocks: t, extensions: d } = await E();
     window.UIEditor.initEditor(
       document.querySelector("#guido-editor"),
       {
         metadata: c,
-        html: n,
-        css: p,
+        html: s,
+        css: f,
         forceRecreate: a,
         locale: "en",
         undoButtonSelector: "#guido__undo-button",
@@ -30,10 +31,10 @@ const J = (c) => {
         customAppearanceMergetags: !0,
         customAppearanceMergetagsBorderColor: "#f1f3fe",
         customAppearanceMergetagsBackgroundColor: "#f1f3fe",
-        customViewStyles: F,
-        conditionsEnabled: ((m = u.features) == null ? void 0 : m.displayConditions) ?? !0,
-        customConditionsEnabled: ((g = u.features) == null ? void 0 : g.displayConditions) ?? !0,
-        conditionCategories: T,
+        customViewStyles: D,
+        conditionsEnabled: ((g = u.features) == null ? void 0 : g.displayConditions) ?? !0,
+        customConditionsEnabled: ((y = u.features) == null ? void 0 : y.displayConditions) ?? !0,
+        conditionCategories: M,
         enableXSSSecurity: !0,
         messageSettingsEnabled: !0,
         displayGmailAnnotations: !0,
@@ -41,7 +42,7 @@ const J = (c) => {
         displayTitle: !1,
         displayUTM: !1,
         selectElementAfterDrop: !0,
-        ...e ? { baseBlocks: e } : {},
+        ...t ? { baseBlocks: t } : {},
         editorFonts: {
           showDefaultStandardFonts: !0,
           showDefaultNotStandardFonts: !0,
@@ -49,38 +50,39 @@ const J = (c) => {
         },
         mergeTags: [
           {
-            entries: U(c.preselectedDynamicContentList)
+            entries: H(c.preselectedDynamicContentList)
           }
         ],
         async onTokenRefreshRequest(o) {
           try {
-            const s = await f();
-            o(s);
-          } catch (s) {
-            l(s, "Failed to refresh token");
+            const n = await m();
+            o(n);
+          } catch (n) {
+            p(n, "Failed to refresh token");
           }
         },
         onTemplateLoaded() {
+          var o, n;
           try {
-            const { importCss: o } = V(), { activateCustomViewStyles: s } = w();
-            o(), s(), c.onReady(), t.isStripoInitialized = !0, t.loadingStatus = !1, setTimeout(() => {
-              t.hasChanges = !1;
+            const { importCss: l } = B(), { activateCustomViewStyles: T, updateTimerInClonedTemplate: b } = V(), { updateTimersOnLoad: k } = F();
+            l(), T(), typeof ((n = (o = window.StripoEditorApi) == null ? void 0 : o.actionsApi) == null ? void 0 : n.updateTimerInClonedTemplate) == "function" ? b() : k(m), c.onReady(), e.isStripoInitialized = !0, e.loadingStatus = !1, setTimeout(() => {
+              e.hasChanges = !1;
             }, 1e3);
-          } catch (o) {
-            l(o, "Failed to load custom interface appearance");
+          } catch (l) {
+            p(l, "Failed to load custom interface appearance");
           }
         },
         onCodeEditorVisibilityChanged(o) {
-          t.isCodeEditorOpen = o;
+          e.isCodeEditorOpen = o;
         },
         onEditorVisualModeChanged(o) {
-          t.editorVisualMode = o.toLowerCase();
+          e.editorVisualMode = o.toLowerCase();
         },
         onVersionHistoryVisibilityChanged(o) {
-          t.isVersionHistoryOpen = o;
+          e.isVersionHistoryOpen = o;
         },
         onDataChanged() {
-          t.hasChanges = !0;
+          e.hasChanges = !0;
         },
         onEvent: S,
         ignoreClickOutsideSelectors: [
@@ -91,26 +93,26 @@ const J = (c) => {
         extensions: d
       }
     );
-  }, h = (i) => new Promise((r, t) => {
+  }, h = (i) => new Promise((r, e) => {
     var d;
     if (document.getElementById("UiEditorScript")) {
       i(), r();
       return;
     }
-    const n = v.guido, a = `https://email-static.useinsider.com/guido/${(d = n == null ? void 0 : n.stripo) == null ? void 0 : d.version}/UIEditor.js`, e = document.createElement("script");
-    e.id = "UiEditorScript", e.type = "module", e.src = a, e.onload = () => {
+    const s = O.guido, a = `https://email-static.useinsider.com/guido/${(d = s == null ? void 0 : s.stripo) == null ? void 0 : d.version}/UIEditor.js`, t = document.createElement("script");
+    t.id = "UiEditorScript", t.type = "module", t.src = a, t.onload = () => {
       i(), r();
-    }, e.onerror = () => {
-      t(new Error(`Failed to load Stripo UIEditor script from S3: ${a}`));
-    }, document.body.appendChild(e);
+    }, t.onerror = () => {
+      e(new Error(`Failed to load Stripo UIEditor script from S3: ${a}`));
+    }, document.body.appendChild(t);
   });
   return { initPlugin: async (i) => {
     await h(async () => {
-      const r = await y();
-      await E(i, r);
+      const r = await C();
+      await w(i, r);
     });
   } };
 };
 export {
-  J as useStripo
+  Y as useStripo
 };

package/dist/composables/useTimerClone.js

@@ -0,0 +1,75 @@
+import { useToaster as C } from "./useToaster.js";
+import { useStripoApi as L } from "../services/stripoApi.js";
+const w = () => {
+  const { handleError: c } = C(), { getToken: T } = L(), d = (t) => /esd-timer-id="(\d+)"/.test(t), a = async (t, o) => {
+    try {
+      console.debug("[TIMER CLONE] Calling Stripo API to clone timers...");
+      const e = await fetch("https://plugins.stripo.email/api/v1/timers/clone", {
+        method: "POST",
+        headers: {
+          "ES-PLUGIN-AUTH": `Bearer ${o}`,
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify({ html: t })
+      });
+      if (console.debug("[TIMER CLONE] API response status:", e.status), !e.ok) {
+        const r = await e.text();
+        throw console.debug("[TIMER CLONE] API error:", r), new Error(`Stripo API error: ${e.status} ${e.statusText}`);
+      }
+      const n = await e.json();
+      return console.debug("[TIMER CLONE] Timers cloned successfully. Map:", n.timersMap), console.debug("[TIMER CLONE] Old HTML length:", t.length), console.debug("[TIMER CLONE] New HTML length:", n.html.length), n.html;
+    } catch (e) {
+      return console.debug("[TIMER CLONE] Error:", e), c(e, "Failed to clone timer IDs"), null;
+    }
+  };
+  return {
+    hasTimerBlocks: d,
+    cloneTimersInHtml: a,
+    cloneTimersOnSave: async (t) => {
+      if (!d(t))
+        return t;
+      console.debug("[TIMER CLONE] Cloning timers on save...");
+      const o = await T();
+      return o ? await a(t, o) || t : (console.debug("[TIMER CLONE] No auth token available, skipping"), t);
+    },
+    updateTimersOnLoad: async (t) => {
+      var o, e, n, r, l, u;
+      try {
+        console.debug("[TIMER CLONE] Starting timer update on template load...");
+        const s = (e = (o = window.UIEditor) == null ? void 0 : o.getHtml) == null ? void 0 : e.call(o);
+        if (!s) {
+          console.debug("[TIMER CLONE] No HTML found, skipping timer update");
+          return;
+        }
+        const E = d(s);
+        if (console.debug("[TIMER CLONE] Has timer blocks?", E), !E)
+          return;
+        const g = s.match(/esd-timer-id="(\d+)"/g);
+        console.debug("[TIMER CLONE] Current timer IDs:", g), console.debug("[TIMER CLONE] Getting auth token...");
+        const p = await t();
+        if (!p) {
+          console.debug("[TIMER CLONE] No auth token available, skipping timer update");
+          return;
+        }
+        const i = await a(s, p);
+        if (!i) {
+          console.debug("[TIMER CLONE] API returned no updated HTML");
+          return;
+        }
+        if (i === s) {
+          console.debug("[TIMER CLONE] HTML unchanged, no update needed");
+          return;
+        }
+        const m = i.match(/esd-timer-id="(\d+)"/g);
+        console.debug("[TIMER CLONE] New timer IDs:", m);
+        const I = ((r = (n = window.UIEditor) == null ? void 0 : n.getCss) == null ? void 0 : r.call(n)) || "";
+        console.debug("[TIMER CLONE] Updating editor with new HTML..."), (u = (l = window.StripoEditorApi) == null ? void 0 : l.actionsApi) != null && u.updateHtmlAndCss ? (window.StripoEditorApi.actionsApi.updateHtmlAndCss(i, I), console.debug("[TIMER CLONE] ✅ Editor updated successfully!")) : console.debug("[TIMER CLONE] updateHtmlAndCss method not available");
+      } catch (s) {
+        console.debug("[TIMER CLONE] Error updating timers:", s), c(s, "Failed to update timer blocks");
+      }
+    }
+  };
+};
+export {
+  w as useTimerClone
+};

package/dist/enums/defaults.js

@@ -23,11 +23,11 @@ const e = {
 }, t = {
   promotional: 1,
   transactional: 2
-}, a = "email", o = "Guido User", s = t.promotional, n = 2, i = 13, u = {
+}, a = "email", o = "Guido User", s = t.promotional, n = 2, i = {
   email: 60,
   architect: 49,
   unsubscribePages: 97
-}, r = [
+}, u = [
   "alfredtesting",
   "electio",
   "eurekatest",
@@ -65,8 +65,7 @@ export {
   a as DefaultProductType,
   o as DefaultUsername,
   n as EditorType,
-  i as MAX_DEFAULT_TEMPLATE_ID,
-  u as ProductIds,
-  r as TEST_PARTNER_LIST,
+  i as ProductIds,
+  u as TEST_PARTNER_LIST,
   t as TemplateTypes
 };

package/dist/services/stripoApi.js

@@ -1,22 +1,21 @@
-import { useHttp as m } from "../composables/useHttp.js";
-import { useToaster as u } from "../composables/useToaster.js";
-import { MAX_DEFAULT_TEMPLATE_ID as i } from "../enums/defaults.js";
-const y = () => {
-  const { get: a } = m(), { handleError: o } = u();
+import { useHttp as a } from "../composables/useHttp.js";
+import { useToaster as s } from "../composables/useToaster.js";
+const m = () => {
+  const { get: r } = a(), { handleError: o } = s();
   return {
     getToken: async () => {
       try {
-        const t = Number(localStorage.getItem("ins-guido-test-instance")), { data: r } = await a(`/stripo/get-user-token?test=${t}`);
-        return r.body.token;
+        const t = Number(localStorage.getItem("ins-guido-test-instance")), { data: e } = await r(`/stripo/get-user-token?test=${t}`);
+        return e.body.token;
       } catch (t) {
         return o(t, "Failed to fetch token"), "";
       }
     },
     getCustomFonts: async () => {
       try {
-        const { data: t = [] } = await a("/stripo/get-partner-custom-fonts");
-        return t.map((r) => ({
-          ...r,
+        const { data: t = [] } = await r("/stripo/get-partner-custom-fonts");
+        return t.map((e) => ({
+          ...e,
           active: !0
         }));
       } catch (t) {
@@ -30,26 +29,21 @@ const y = () => {
         forceRecreate: !0
       };
       try {
-        const c = new URLSearchParams(window.location.search).get("default-template"), s = c ? parseInt(c) : 0, l = s >= 1 && s <= i ? s : 0, { data: e } = await a(
-          `/stripo/default-template/${l}`
-        );
-        let n;
-        if (typeof e == "string")
-          n = JSON.parse(e);
-        else if (e && typeof e == "object" && "html" in e && "css" in e)
-          n = e;
-        else
+        const { data: e } = await r("/stripo/default-template/0");
+        try {
+          return {
+            ...JSON.parse(e),
+            forceRecreate: !0
+          };
+        } catch {
           return t;
-        return {
-          ...n,
-          forceRecreate: !0
-        };
-      } catch (r) {
-        return o(r, "Failed to fetch default template"), t;
+        }
+      } catch (e) {
+        return o(e, "Failed to fetch default template"), t;
       }
     }
   };
 };
 export {
-  y as useStripoApi
+  m as useStripoApi
 };

package/dist/src/composables/useActionsApi.d.ts

@@ -5,4 +5,5 @@ export declare const useActionsApi: () => {
     getTemplateData: () => Promise<TemplateData>;
     activateCustomViewStyles: (isActive?: boolean) => void;
     getPreviewData: (options?: CompileEmailOptions) => Promise<CompiledEmailResult>;
+    updateTimerInClonedTemplate: () => Promise<string | null>;
 };

package/dist/src/composables/useTimerClone.d.ts

@@ -0,0 +1,6 @@
+export declare const useTimerClone: () => {
+    hasTimerBlocks: (html: string) => boolean;
+    cloneTimersInHtml: (html: string, authToken: string) => Promise<string | null>;
+    cloneTimersOnSave: (html: string) => Promise<string>;
+    updateTimersOnLoad: (getTokenFn: () => Promise<string>) => Promise<void>;
+};

package/dist/src/enums/defaults.d.ts

@@ -8,6 +8,5 @@ export declare const DefaultProductType = "email";
 export declare const DefaultUsername = "Guido User";
 export declare const DefaultMessageType: number;
 export declare const EditorType: number;
-export declare const MAX_DEFAULT_TEMPLATE_ID = 13;
 export declare const ProductIds: Record<string, number>;
 export declare const TEST_PARTNER_LIST: string[];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "1.0.3-beta.49f18d1",
+  "version": "1.0.3-beta.4a63a85",
   "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",