@useinsider/guido 1.0.3-beta.48213b9 → 1.0.3-beta.48bff34

package/dist/components/Guido.vue.js

@@ -12,7 +12,7 @@ var t = function() {
   n,
   !1,
   null,
-  "b22f3777"
+  "9fb62152"
 );
 const u = s.exports;
 export {

package/dist/components/Guido.vue2.js

@@ -1,23 +1,23 @@
-import { defineComponent as z, defineAsyncComponent as W, ref as B, computed as _, watch as K, onMounted as O, onUnmounted as j } from "vue";
-import { provideGuidoActions as q } from "../composables/useGuidoActions.js";
-import { usePartner as J } from "../composables/usePartner.js";
-import { useStripo as Q } from "../composables/useStripo.js";
-import { migrate as L } from "../config/migrator/index.js";
-import { DefaultUsername as V, DefaultMessageType as X, DefaultGuidoConfig as Y } from "../enums/defaults.js";
-import Z from "./organisms/base/Toaster.vue.js";
-import $ from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
-import ee from "./organisms/header/HeaderWrapper.vue.js";
-import te from "./organisms/LoadingWrapper.vue.js";
-import oe from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
-import ne from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
-import { useStripoApi as re } from "../services/stripoApi.js";
-import { useConfigStore as ie } from "../stores/config.js";
-import { useDynamicContentStore as ae } from "../stores/dynamic-content.js";
-import { useEditorStore as se } from "../stores/editor.js";
-import { usePreviewStore as ce } from "../stores/preview.js";
-import { useUnsubscribeStore as me } from "../stores/unsubscribe.js";
-import de from "../node_modules/lodash-es/merge.js";
-const We = /* @__PURE__ */ z({
+import { defineComponent as z, defineAsyncComponent as L, ref as B, computed as k, watch as K, onMounted as j, onUnmounted as q } from "vue";
+import { provideGuidoActions as J } from "../composables/useGuidoActions.js";
+import { usePartner as Q } from "../composables/usePartner.js";
+import { useStripo as V } from "../composables/useStripo.js";
+import { migrate as A } from "../config/migrator/index.js";
+import { DefaultUsername as X, DefaultMessageType as Y, DefaultGuidoConfig as Z } from "../enums/defaults.js";
+import $ from "./organisms/base/Toaster.vue.js";
+import ee from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
+import te from "./organisms/header/HeaderWrapper.vue.js";
+import oe from "./organisms/LoadingWrapper.vue.js";
+import ne from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
+import re from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
+import { useStripoApi as ie } from "../services/stripoApi.js";
+import { useConfigStore as ae } from "../stores/config.js";
+import { useDynamicContentStore as se } from "../stores/dynamic-content.js";
+import { useEditorStore as ce } from "../stores/editor.js";
+import { usePreviewStore as me } from "../stores/preview.js";
+import { useUnsubscribeStore as de } from "../stores/unsubscribe.js";
+import ue from "../node_modules/lodash-es/merge.js";
+const _e = /* @__PURE__ */ z({
   __name: "Guido",
   props: {
     templateId: null,
@@ -32,12 +32,12 @@ const We = /* @__PURE__ */ z({
     templateConfig: null
   },
   emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change", "ready", "onboarding:finished"],
-  setup(k, { expose: A, emit: n }) {
-    const f = k, N = W(
+  setup(N, { expose: F, emit: n }) {
+    const f = N, H = L(
       () => import("./organisms/email-preview/PreviewContainer.vue.js")
-    ), F = W(
+    ), R = L(
       () => import("./organisms/onboarding/OnboardingWrapper.vue.js")
-    ), g = B(), a = ae(), y = me(), v = ie(), s = se(), H = ce(), r = _(() => s.hasChanges), { getPartnerName: b, getProductType: C, isTestPartner: R } = J(), h = () => {
+    ), g = B(), a = se(), y = de(), v = ae(), s = ce(), x = me(), r = k(() => s.hasChanges), { getPartnerName: C, getProductType: b, isTestPartner: M } = Q(), h = () => {
       var e;
       return (e = g.value) == null ? void 0 : e.handleSave(!0);
     }, {
@@ -47,31 +47,31 @@ const We = /* @__PURE__ */ z({
       templateConfig: o,
       html: i = "",
       css: D = "",
-      partnerName: m = b(),
-      productType: d = C(),
-      messageType: E = X,
-      username: T = V
+      partnerName: m = C(),
+      productType: d = b(),
+      messageType: E = Y,
+      username: P = X
     } = f, u = (o == null ? void 0 : o.preselectedDynamicContentList) || [];
-    s.templateId = c, window.GuidoConfig = de(Y, w), window.GuidoConfig.partner = {
+    s.templateId = c, window.GuidoConfig = ue(Z, w), window.GuidoConfig.partner = {
       partnerName: m,
       productType: d,
       messageType: E
     }, v.templateConfig = o;
-    const { initPlugin: P } = Q({
+    const { initPlugin: T } = V({
       emailId: c,
       userId: S,
-      username: T,
+      username: P,
       partnerName: m,
       productType: d,
       preselectedDynamicContentList: u,
       onReady: () => {
         console.debug("guido:ready"), n("ready");
       }
-    }), { getDefaultTemplate: G } = re(), x = _(() => {
+    }), { getDefaultTemplate: G } = ie(), O = k(() => {
       var e;
       return !((e = window.GuidoConfig) != null && e.useHeader);
     });
-    q({
+    J({
       onBack: () => {
         console.debug("guido:back"), n("back");
       },
@@ -89,44 +89,44 @@ const We = /* @__PURE__ */ z({
     };
     return K(() => r.value, () => {
       n("on-change", r.value);
-    }), O(async () => {
+    }), j(async () => {
       console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow");
       try {
         y.selectedUnsubscribePages = (o == null ? void 0 : o.selectedUnsubscribePages) || [];
         let t = {
-          html: i && await L(i),
+          html: i && await A(i),
           css: D,
           forceRecreate: !0
           // TODO: It should be false for old templates. We will communicate with Stripo
         };
-        t.html || (t = await G(), t.html = await L(t.html)), await P(t), a.selectedDynamicContentList = u;
+        t.html || (t = await G(), t.html = await A(t.html)), await T(t), a.selectedDynamicContentList = u;
       } catch (t) {
         console.error("Failed to initialize Stripo editor:", t);
       }
-      const e = (t) => {
-        const l = t, { attribute: p, position: M } = l.detail;
-        return { attribute: p, position: M };
+      const e = (t, l) => {
+        const p = t, { attribute: W, position: _ } = p.detail;
+        return console.log(l, W, "Position:", _), { attribute: W, position: _ };
       };
       document.addEventListener("dynamic-content:open", (t) => {
-        const { attribute: l, position: p } = e(t);
+        const { attribute: l, position: p } = e(t, "📥 Dynamic Content Open Event - Data:");
         n("dynamic-content:open", l, p);
       });
-    }), j(() => {
+    }), q(() => {
       try {
         window.UIEditor.removeEditor();
       } catch {
         console.debug("Failed to remove Stripo editor: No editor found");
       }
-    }), A({
+    }), F({
       dynamicContent: {
         insert: I,
         close: U
       },
       hasChanges: r,
       saveSilent: h
-    }), { __sfc: !0, PreviewContainer: N, OnboardingWrapper: F, headerWrapperRef: g, dynamicContentStore: a, unsubscribeStore: y, props: f, configStore: v, editorStore: s, previewStore: H, hasChanges: r, getPartnerName: b, getProductType: C, isTestPartner: R, saveSilent: h, templateId: c, userId: S, guidoConfig: w, templateConfig: o, html: i, css: D, partnerName: m, productType: d, messageType: E, username: T, preselectedDynamicContentList: u, emit: n, initPlugin: P, getDefaultTemplate: G, noHeader: x, insertDynamicContent: I, closeDynamicContent: U, Toaster: Z, FilterSelectionDrawer: $, HeaderWrapper: ee, LoadingWrapper: te, SaveAsTemplateDrawer: oe, UnsubscribeWrapper: ne };
+    }), { __sfc: !0, PreviewContainer: H, OnboardingWrapper: R, headerWrapperRef: g, dynamicContentStore: a, unsubscribeStore: y, props: f, configStore: v, editorStore: s, previewStore: x, hasChanges: r, getPartnerName: C, getProductType: b, isTestPartner: M, saveSilent: h, templateId: c, userId: S, guidoConfig: w, templateConfig: o, html: i, css: D, partnerName: m, productType: d, messageType: E, username: P, preselectedDynamicContentList: u, emit: n, initPlugin: T, getDefaultTemplate: G, noHeader: O, insertDynamicContent: I, closeDynamicContent: U, Toaster: $, FilterSelectionDrawer: ee, HeaderWrapper: te, LoadingWrapper: oe, SaveAsTemplateDrawer: ne, UnsubscribeWrapper: re };
   }
 });
 export {
-  We as default
+  _e as default
 };

package/dist/extensions/DynamicContent/dynamic-content-modal.js

@@ -1,12 +1,11 @@
-var d = Object.defineProperty;
-var m = (t, e, n) => e in t ? d(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
-var a = (t, e, n) => m(t, typeof e != "symbol" ? e + "" : e, n);
-class C {
+var m = Object.defineProperty;
+var r = (t, e, n) => e in t ? m(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
+var a = (t, e, n) => r(t, typeof e != "symbol" ? e + "" : e, n);
+class v {
   constructor() {
     a(this, "selectedDynamicContent", null);
     a(this, "dataSelectCallback", () => {
     });
-    a(this, "closeDynamicContentHandler", null);
   }
   /**
    * Opens the merge tags library modal
@@ -14,20 +13,22 @@ class C {
    * @param onDataSelectCallback - Callback invoked when user selects a merge tag
    * @param position - Optional position data to place the modal
    */
-  openMergeTagsLibrary(e, n, l) {
-    this.closeDynamicContentHandler && (document.removeEventListener("dynamic-content:close", this.closeDynamicContentHandler), this.closeDynamicContentHandler = null), this.dataSelectCallback = n, this.selectedDynamicContent = e;
-    const o = {
+  openMergeTagsLibrary(e, n, s) {
+    this.dataSelectCallback = n, this.selectedDynamicContent = e;
+    const l = {
       attribute: e,
-      position: l
-    }, s = new CustomEvent("dynamic-content:open", {
-      detail: o
+      position: s
+    }, i = new CustomEvent("dynamic-content:open", {
+      detail: l
     });
-    document.dispatchEvent(s), this.closeDynamicContentHandler = (i) => {
-      const c = i.detail;
-      this.selectedDynamicContent = c, c.text && c.value && this.dataSelectCallback(c), this.closeDynamicContentHandler && (document.removeEventListener("dynamic-content:close", this.closeDynamicContentHandler), this.closeDynamicContentHandler = null);
-    }, document.addEventListener("dynamic-content:close", this.closeDynamicContentHandler);
+    document.dispatchEvent(i);
+    const o = (d) => {
+      const c = d.detail;
+      this.selectedDynamicContent = c, c.text && c.value && this.dataSelectCallback(c), document.removeEventListener("dynamic-content:close", o);
+    };
+    document.addEventListener("dynamic-content:close", o);
   }
 }
 export {
-  C as ExternalMergeTagsLibrary
+  v as ExternalMergeTagsLibrary
 };

package/dist/extensions/DynamicContent/dynamic-content.js

@@ -1,75 +1,70 @@
 var l = Object.defineProperty;
-var g = (o, s, e) => s in o ? l(o, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : o[s] = e;
-var r = (o, s, e) => g(o, typeof s != "symbol" ? s + "" : s, e);
+var g = (r, o, t) => o in r ? l(r, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : r[o] = t;
+var s = (r, o, t) => g(r, typeof o != "symbol" ? o + "" : o, t);
 import { dynamicContentToMergeTags as d } from "../../utils/genericUtil.js";
 import { UIElement as u, UIElementType as a, UEAttr as m, UIElementTagRegistry as h } from "../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
 import { ExternalMergeTagsLibrary as T } from "./dynamic-content-modal.js";
 const c = "external-dynamic-content-ui-element", y = "button-add-dynamic-content";
-class _ extends h {
-  registerUiElements(s) {
-    s[a.MERGETAGS] = c;
+class C extends h {
+  registerUiElements(o) {
+    o[a.MERGETAGS] = c;
   }
 }
-class b extends u {
+class E extends u {
   constructor() {
     super(...arguments);
-    r(this, "mergeTagsButton", null);
-    r(this, "mergeTagsLibrary", null);
-    r(this, "clickListener", null);
-    r(this, "lastClickedPosition");
-    r(this, "mousedownListener", null);
-    r(this, "closeEventListener", null);
+    s(this, "mergeTagsButton", null);
+    s(this, "mergeTagsLibrary", null);
+    s(this, "clickListener", null);
+    s(this, "lastClickedPosition");
+    s(this, "mousedownListener", null);
   }
   getId() {
     return c;
   }
-  onRender(e) {
-    var t;
-    this.mergeTagsButton = e.querySelector("#guido__btn-add-dynamic-content"), this.clickListener = this._onClick.bind(this), (t = this.mergeTagsButton) == null || t.addEventListener("click", this.clickListener), this._setupCoordinateTracking(), this.closeEventListener = this._handleCloseEvent.bind(this), document.addEventListener("dynamic-content:close", this.closeEventListener);
+  onRender(t) {
+    var e;
+    this.mergeTagsButton = t.querySelector("#guido__btn-add-dynamic-content"), this.clickListener = this._onClick.bind(this), (e = this.mergeTagsButton) == null || e.addEventListener("click", this.clickListener), this._setupCoordinateTracking();
   }
   onDestroy() {
-    var e;
-    this.clickListener && ((e = this.mergeTagsButton) == null || e.removeEventListener("click", this.clickListener)), this._cleanupCoordinateTracking(), this.closeEventListener && document.removeEventListener("dynamic-content:close", this.closeEventListener), this.mergeTagsButton = null, this.clickListener = null, this.closeEventListener = null, this.lastClickedPosition = void 0;
+    var t;
+    this.clickListener && ((t = this.mergeTagsButton) == null || t.removeEventListener("click", this.clickListener)), this._cleanupCoordinateTracking(), this.mergeTagsButton = null, this.clickListener = null, this.lastClickedPosition = void 0;
   }
   _onClick() {
     this.openMergeTagLibrary();
   }
-  /**
-   * Handles close event - unselects the merge tag so it can be clicked again
-   */
-  _handleCloseEvent() {
-    this.api.triggerValueChange(null);
-  }
   /**
    * Called when Stripo detects merge tag interactions
    * This is the key method that receives notifications about merge tag clicks
    * @param name - Attribute name (e.g., 'mergeTag')
    * @param value - MergeTag object with label, value, selStart, selEnd, etc.
    */
-  onAttributeUpdated(e, t) {
-    if (e !== "mergeTag" || !t)
+  onAttributeUpdated(t, e) {
+    if (t !== "mergeTag" || !e)
       return;
     const n = {
-      text: t.label,
-      value: t.value
+      text: e.label,
+      value: e.value,
+      fallback: e.fallback,
+      format: e.format
     }, i = this.lastClickedPosition;
     this.lastClickedPosition = void 0, this._openDynamicContentLibrary(n, i);
   }
   openMergeTagLibrary() {
-    const e = this._getButtonPosition(), t = { value: "", text: "" };
-    this._openDynamicContentLibrary(t, e);
+    const t = this._getButtonPosition(), e = { value: "", text: "" };
+    this._openDynamicContentLibrary(e, t);
   }
   /**
    * Opens the dynamic content library for external apps
    * Dispatches event with dynamic content data and position
    */
-  _openDynamicContentLibrary(e, t) {
+  _openDynamicContentLibrary(t, e) {
     this._ensureMergeTagsLibrary(), this.mergeTagsLibrary.openMergeTagsLibrary(
-      e,
+      t,
       (n) => {
-        n.text && n.value && this.api.triggerValueChange(d([n])[0]);
+        this.api.triggerValueChange(d([n])[0]);
       },
-      t
+      e
     );
   }
   /**
@@ -80,64 +75,65 @@ class b extends u {
   }
   /**
    * Gets the button's position on the screen
-   * Used to position the modal or anything else near the button
+   * Used to position the modal near the button
    */
   _getButtonPosition() {
-    const e = this.mergeTagsButton.getBoundingClientRect();
+    const t = this.mergeTagsButton.getBoundingClientRect();
     return {
-      x: e.left,
-      y: e.top,
-      width: e.width,
-      height: e.height
+      x: t.left,
+      y: t.top,
+      width: t.width,
+      height: t.height
     };
   }
   /**
    * Sets up coordinate tracking for merge tag clicks in the iframe
-   * Workaround from Stripo intercepting click events - tracks mousedown events instead
+   * Workaround for Stripo intercepting click events - tracks mousedown events instead
    */
+  // TODO: Check possibilities with baseApi to get the position of the merge tag and its values
   _setupCoordinateTracking() {
-    const e = () => {
-      const t = this._getEditorFrame();
-      if (!t) {
-        setTimeout(e, 100);
+    const t = () => {
+      const e = this._getEditorFrame();
+      if (!e) {
+        setTimeout(t, 100);
         return;
       }
       this.mousedownListener = (n) => {
         const i = this._findMergeTagElement(n.target);
-        i && (this.lastClickedPosition = this._calculateAbsolutePosition(t, i));
-      }, t.contentWindow.document.addEventListener("mousedown", this.mousedownListener);
+        i && (this.lastClickedPosition = this._calculateAbsolutePosition(e, i));
+      }, e.contentWindow.document.addEventListener("mousedown", this.mousedownListener);
     };
-    e();
+    t();
   }
   /**
    * Gets the editor iframe element
    */
   _getEditorFrame() {
     var n;
-    const e = document.querySelector("ui-editor");
-    if (!(e != null && e.shadowRoot))
+    const t = document.querySelector("ui-editor");
+    if (!(t != null && t.shadowRoot))
       return null;
-    const t = e.shadowRoot.querySelector("iframe");
-    return (n = t == null ? void 0 : t.contentWindow) != null && n.document ? t : null;
+    const e = t.shadowRoot.querySelector("iframe");
+    return (n = e == null ? void 0 : e.contentWindow) != null && n.document ? e : null;
   }
   /**
    * Finds merge tag element in the element tree
    */
-  _findMergeTagElement(e) {
+  _findMergeTagElement(t) {
     var n, i;
-    let t = e;
-    for (; t; ) {
-      if ((n = t.classList) != null && n.contains("target") || (i = t.classList) != null && i.contains("esd-merge-tag"))
-        return t;
-      t = t.parentElement;
+    let e = t;
+    for (; e; ) {
+      if ((n = e.classList) != null && n.contains("target") || (i = e.classList) != null && i.contains("esd-merge-tag"))
+        return e;
+      e = e.parentElement;
     }
     return null;
   }
   /**
    * Calculates absolute position of element relative to page
    */
-  _calculateAbsolutePosition(e, t) {
-    const n = e.getBoundingClientRect(), i = t.getBoundingClientRect();
+  _calculateAbsolutePosition(t, e) {
+    const n = t.getBoundingClientRect(), i = e.getBoundingClientRect();
     return {
       x: n.x + i.x,
       y: n.y + i.y,
@@ -149,11 +145,11 @@ class b extends u {
    * Cleans up the coordinate tracking event listener
    */
   _cleanupCoordinateTracking() {
-    var t;
+    var e;
     if (!this.mousedownListener)
       return;
-    const e = this._getEditorFrame();
-    (t = e == null ? void 0 : e.contentWindow) != null && t.document && e.contentWindow.document.removeEventListener("mousedown", this.mousedownListener), this.mousedownListener = null;
+    const t = this._getEditorFrame();
+    (e = t == null ? void 0 : t.contentWindow) != null && e.document && t.contentWindow.document.removeEventListener("mousedown", this.mousedownListener), this.mousedownListener = null;
   }
   /**
    * Returns the HTML template for the "Add Dynamic Content" button
@@ -174,6 +170,6 @@ class b extends u {
   }
 }
 export {
-  _ as DynamicContentTagRegistry,
-  b as DynamicContentUiElementExtension
+  C as DynamicContentTagRegistry,
+  E as DynamicContentUiElementExtension
 };

package/dist/guido.css

@@ -1 +1 @@
-.gap-16[data-v-6562e38c],.gap-16[data-v-1ccb6d4a]{gap:16px}[data-v-0502bceb] .in-button-v2__wrapper{line-height:0}[data-v-b5997368] .in-segments-wrapper .in-tooltip-wrapper__box{text-align:left}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history-wrapper[data-v-52a77eec]{gap:8px}.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}.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}.guido-loading__wrapper[data-v-dced5582]{height:100%;top:75px}.guido-editor__wrapper[data-v-b22f3777],.guido-editor__container[data-v-b22f3777]{width:100%;height:calc(100vh - 128px)}.guido-editor__no-header[data-v-b22f3777]{height:calc(100vh - 75px)}[data-v-70835920] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-a86fc486]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-a86fc486]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-a86fc486]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-a86fc486]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-a86fc486]{object-fit:cover;transform:scale(1)}[data-v-dd57102d] .guido__verion-history-view-option-selection-desktop svg,[data-v-dd57102d] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-dd57102d] .in-segments-wrapper__button_selected,[data-v-dd57102d] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-7a09985c]{gap:16px}[data-v-c2adc57d] .in-progress-wrapper__progress p span:last-child{display:none!important}.desktop-preview-container[data-v-2dd60b0c],[data-v-2dd60b0c] .desktop-preview-container .in-container{min-height:720px!important;height:100%}.cropped-text[data-v-f20b3a9b]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-v-d3c52b44] .vueperslides__bullets,[data-v-a408dcea] .vueperslides__bullets{pointer-events:none!important}[data-v-a408dcea] .vueperslides__parallax-wrapper{height:110px!important}
+.gap-16[data-v-6562e38c],.gap-16[data-v-1ccb6d4a]{gap:16px}[data-v-0502bceb] .in-button-v2__wrapper{line-height:0}[data-v-b5997368] .in-segments-wrapper .in-tooltip-wrapper__box{text-align:left}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history-wrapper[data-v-52a77eec]{gap:8px}.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}.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}.guido-loading__wrapper[data-v-dced5582]{height:100%;top:75px}.guido-editor__wrapper[data-v-9fb62152],.guido-editor__container[data-v-9fb62152]{width:100%;height:calc(100vh - 128px)}.guido-editor__no-header[data-v-9fb62152]{height:calc(100vh - 75px)}[data-v-70835920] .in-breadcrumb-wrapper__links{cursor:pointer}.templates-wrapper[data-v-a86fc486]{gap:16px;grid-template-columns:repeat(3,1fr)}.templates-wrapper .template-wrapper[data-v-a86fc486]{cursor:pointer}.templates-wrapper .template-wrapper .template-container[data-v-a86fc486]{height:274px;padding:2px;transition:none}.templates-wrapper .template-wrapper .template-container.selected[data-v-a86fc486]{padding:1px}.templates-wrapper .template-wrapper .template-container .thumbnail[data-v-a86fc486]{object-fit:cover;transform:scale(1)}[data-v-dd57102d] .guido__verion-history-view-option-selection-desktop svg,[data-v-dd57102d] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-dd57102d] .in-segments-wrapper__button_selected,[data-v-dd57102d] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.error-list[data-v-7a09985c]{gap:16px}[data-v-c2adc57d] .in-progress-wrapper__progress p span:last-child{display:none!important}.desktop-preview-container[data-v-2dd60b0c],[data-v-2dd60b0c] .desktop-preview-container .in-container{min-height:720px!important;height:100%}.cropped-text[data-v-f20b3a9b]{width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[data-v-d3c52b44] .vueperslides__bullets,[data-v-a408dcea] .vueperslides__bullets{pointer-events:none!important}[data-v-a408dcea] .vueperslides__parallax-wrapper{height:110px!important}

package/dist/src/extensions/DynamicContent/dynamic-content-modal.d.ts

@@ -2,7 +2,6 @@ import type { DynamicContent, PositionData } from '@@/Types/generic';
 export declare class ExternalMergeTagsLibrary {
     selectedDynamicContent: DynamicContent | null;
     dataSelectCallback: (data: DynamicContent) => void;
-    private closeDynamicContentHandler;
     /**
      * Opens the merge tags library modal
      * @param dynamicContent - Currently selected dynamic content (if any)

package/dist/src/extensions/DynamicContent/dynamic-content.d.ts

@@ -9,15 +9,10 @@ export declare class DynamicContentUiElementExtension extends UIElement {
     private clickListener;
     private lastClickedPosition;
     private mousedownListener;
-    private closeEventListener;
     getId(): string;
     onRender(container: HTMLElement): void;
     onDestroy(): void;
     _onClick(): void;
-    /**
-     * Handles close event - unselects the merge tag so it can be clicked again
-     */
-    private _handleCloseEvent;
     /**
      * Called when Stripo detects merge tag interactions
      * This is the key method that receives notifications about merge tag clicks
@@ -37,12 +32,12 @@ export declare class DynamicContentUiElementExtension extends UIElement {
     private _ensureMergeTagsLibrary;
     /**
      * Gets the button's position on the screen
-     * Used to position the modal or anything else near the button
+     * Used to position the modal near the button
      */
     private _getButtonPosition;
     /**
      * Sets up coordinate tracking for merge tag clicks in the iframe
-     * Workaround from Stripo intercepting click events - tracks mousedown events instead
+     * Workaround for Stripo intercepting click events - tracks mousedown events instead
      */
     private _setupCoordinateTracking;
     /**

package/dist/stores/dynamic-content.js

@@ -2,7 +2,7 @@ import { removeDuplicatesFromArray as n } from "../utils/arrayUtil.js";
 import { defineStore as a } from "pinia";
 const s = a("dynamicContent", {
   state: () => ({
-    selectedDynamicContent: { text: "", value: "" },
+    selectedDynamicContent: { text: "", value: "", fallback: "" },
     selectedDynamicContentList: []
   }),
   actions: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@useinsider/guido",
-  "version": "1.0.3-beta.48213b9",
+  "version": "1.0.3-beta.48bff34",
   "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",