@useinsider/guido 3.2.0-beta.570fb6d → 3.2.0-beta.5cea610

package/dist/components/organisms/extensions/recommendation/Filters.vue2.js

@@ -1,4 +1,4 @@
-import { defineComponent as v, computed as o, ref as O, watch as f } from "vue";
+import { defineComponent as v, computed as l, ref as O, watch as f } from "vue";
 import { useTranslations as g } from "../../../../composables/useTranslations.js";
 import { useRecommendationExtensionStore as R } from "../../../../extensions/Blocks/Recommendation/store/recommendation.js";
 import { getTooltipOptions as T } from "../../../../utils/tooltipUtils.js";
@@ -12,11 +12,11 @@ const V = /* @__PURE__ */ v({
   },
   emits: ["reset-validation"],
   setup(x, { expose: u, emit: s }) {
-    const p = g(), t = R(), n = o(() => t.getUniqueFilterGroups.map((e) => ({
+    const p = g(), t = R(), a = l(() => t.getUniqueFilterGroups.map((e) => ({
       text: e.toString(),
       value: e
     }))), r = O(1);
-    f(n, (e) => {
+    f(a, (e) => {
       if (!e.length)
         return;
       e.some((h) => h.value === r.value) || (r.value = e[0].value);
@@ -27,24 +27,27 @@ const V = /* @__PURE__ */ v({
     u({ switchToGroup: i });
     const c = () => {
       s("reset-validation");
-      const e = t.getUniqueFilterGroups, a = e.length > 0 ? Math.max(...e) + 1 : 1;
-      t.addFilterGroup(a), r.value = a;
-    }, d = o(() => n.value.length >= 3), l = o(() => t.getSelectedFilterGroup(r.value)), F = o(() => l.value.length >= 10), _ = o(() => l.value.length > 1), G = o(() => n.value.length > 1), m = o(() => l.value[0]?.outerGroupOperator || "*");
-    return { __sfc: !0, MAX_FILTER_GROUP_COUNT: 3, MAX_FILTER_PER_GROUP_COUNT: 10, trans: p, store: t, emit: s, filterGroupList: n, selectedFilterGroup: r, switchToGroup: i, handleAddFilterGroup: c, isMaxFilterGroupCount: d, selectedFilterGroupFilters: l, isMaxFilterPerGroupCount: F, hasLogicAdapter: _, hasRemoveFilterButton: G, outerGroupOperator: m, handleOuterGroupOperatorChange: (e) => {
-      l.value.forEach((a) => {
-        t.updateFilter({ ...a, outerGroupOperator: e });
+      const e = t.getUniqueFilterGroups, o = e.length > 0 ? Math.max(...e) + 1 : 1;
+      t.addFilterGroup(o), r.value = o;
+    }, d = l(() => a.value.length >= 3), n = l(() => t.getSelectedFilterGroup(r.value)), F = l(() => n.value.length >= 10), _ = l(() => n.value.length > 1), G = l(() => a.value.length > 1), m = l(() => {
+      var o;
+      return ((o = n.value[0]) == null ? void 0 : o.outerGroupOperator) || "*";
+    });
+    return { __sfc: !0, MAX_FILTER_GROUP_COUNT: 3, MAX_FILTER_PER_GROUP_COUNT: 10, trans: p, store: t, emit: s, filterGroupList: a, selectedFilterGroup: r, switchToGroup: i, handleAddFilterGroup: c, isMaxFilterGroupCount: d, selectedFilterGroupFilters: n, isMaxFilterPerGroupCount: F, hasLogicAdapter: _, hasRemoveFilterButton: G, outerGroupOperator: m, handleOuterGroupOperatorChange: (e) => {
+      n.value.forEach((o) => {
+        t.updateFilter({ ...o, outerGroupOperator: e });
       });
     }, handleAddFilter: () => {
       s("reset-validation"), t.addFilter(
         t.createDefaultFilter(
           r.value,
-          l.value.length + 1
+          n.value.length + 1
         )
       );
     }, handleDeleteFilter: (e) => {
       t.deleteFilter(e);
     }, handleDeleteFilterGroup: () => {
-      n.value.length <= 1 || t.deleteFilterGroup(r.value);
+      a.value.length <= 1 || t.deleteFilterGroup(r.value);
     }, getTooltipOptions: T, InSegments: E, InButtonV2: U, FilterItem: A, LogicAdapter: C };
   }
 });

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

@@ -1,22 +1,23 @@
-import i from "./EditorActions.vue2.js";
+import l from "./EditorActions.vue2.js";
 /* empty css                   */
-import n from "../../../_virtual/_plugin-vue2_normalizer.js";
-var a = function() {
+import d from "../../../_virtual/_plugin-vue2_normalizer.js";
+var u = function() {
+  var s, i, n, a;
   var o = this, e = o._self._c, t = o._self._setupProxy;
-  return e("div", { staticClass: "d-f editor-actions" }, [t.isVersionHistoryButtonVisible ? e(t.InButtonV2, { attrs: { id: "guido__history-button", "left-icon": "line-architect-version-history", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryButtonDisabled, "label-text-status": !1, "selected-status": t.editorStore.isVersionHistoryOpen, "tooltip-options": t.getTooltipOptions("guido__history-button"), "tooltip-text": t.versionHistoryTooltipText }, on: { click: t.handleVersionHistory } }) : o._e(), e(t.InButtonV2, { attrs: { id: "guido__export-button", "left-icon": "line-export", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isExportButtonDisabled, "label-text-status": !1, "loading-status": t.isExporting, "tooltip-options": t.getTooltipOptions("guido__export-button"), "tooltip-text": t.trans("newsletter.export") }, on: { click: t.handleExport } }), t.config?.features?.saveAsTemplate ? e(t.InButtonV2, { attrs: { id: "guido__save-as-button", "left-icon": "line-newsletter-save-as-template", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isSaveAsButtonDisabled, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__save-as-button"), "tooltip-text": t.trans("newsletter.save-templates") }, on: { click: t.handleSaveAs } }) : o._e(), t.config?.features?.testMessage ? e(t.InButtonV2, { attrs: { id: "guido__test-button", "left-icon": "line-architect-test-journey", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isTestButtonDisabled, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__test-button", { staticPosition: "bottom right" }), "tooltip-text": t.trans("newsletter.test-email") }, on: { click: t.handleTestEmail } }) : o._e(), t.editorStore.isPreviewModeOpen ? o._e() : e(t.InButtonV2, { staticClass: "ml-3", attrs: { id: "guido__save-button", "label-text": "Save", "disabled-status": !t.isSaving && t.editorStore.isSaveButtonDisabled, "loading-status": t.isSaving }, on: { click: function(s) {
+  return e("div", { staticClass: "d-f editor-actions" }, [t.isVersionHistoryButtonVisible ? e(t.InButtonV2, { attrs: { id: "guido__history-button", "left-icon": "line-architect-version-history", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryButtonDisabled, "label-text-status": !1, "selected-status": t.editorStore.isVersionHistoryOpen, "tooltip-options": t.getTooltipOptions("guido__history-button"), "tooltip-text": t.versionHistoryTooltipText }, on: { click: t.handleVersionHistory } }) : o._e(), e(t.InButtonV2, { attrs: { id: "guido__export-button", "left-icon": "line-export", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isExportButtonDisabled, "label-text-status": !1, "loading-status": t.isExporting, "tooltip-options": t.getTooltipOptions("guido__export-button"), "tooltip-text": t.trans("newsletter.export") }, on: { click: t.handleExport } }), (i = (s = t.config) == null ? void 0 : s.features) != null && i.saveAsTemplate ? e(t.InButtonV2, { attrs: { id: "guido__save-as-button", "left-icon": "line-newsletter-save-as-template", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isSaveAsButtonDisabled, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__save-as-button"), "tooltip-text": t.trans("newsletter.save-templates") }, on: { click: t.handleSaveAs } }) : o._e(), (a = (n = t.config) == null ? void 0 : n.features) != null && a.testMessage ? e(t.InButtonV2, { attrs: { id: "guido__test-button", "left-icon": "line-architect-test-journey", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isTestButtonDisabled, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__test-button", { staticPosition: "bottom right" }), "tooltip-text": t.trans("newsletter.test-email") }, on: { click: t.handleTestEmail } }) : o._e(), t.editorStore.isPreviewModeOpen ? o._e() : e(t.InButtonV2, { staticClass: "ml-3", attrs: { id: "guido__save-button", "label-text": "Save", "disabled-status": !t.isSaving && t.editorStore.isSaveButtonDisabled, "loading-status": t.isSaving }, on: { click: function(r) {
     return t.handleSave(!1);
-  } } }), e(t.MigrationConfirmModal, { ref: "migrationModalRef", on: { confirm: function(s) {
+  } } }), e(t.MigrationConfirmModal, { ref: "migrationModalRef", on: { confirm: function(r) {
     return t.executeSave(!1);
   } } })], 1);
-}, r = [], l = /* @__PURE__ */ n(
-  i,
-  a,
-  r,
+}, p = [], c = /* @__PURE__ */ d(
+  l,
+  u,
+  p,
   !1,
   null,
   "4e2a4adb"
 );
-const _ = l.exports;
+const v = c.exports;
 export {
-  _ as default
+  v as default
 };

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

@@ -17,8 +17,8 @@ import K from "./MigrationConfirmModal.vue.js";
 const ut = /* @__PURE__ */ O({
   __name: "EditorActions",
   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(), t = I(), y = P(), { hasMigrations: S } = J(y), s = L(), i = n(!1), r = n(!1), g = n(), H = B(), T = () => {
-      if (t.isVersionHistoryOpen) {
+    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) {
         p();
         return;
       }
@@ -26,35 +26,39 @@ const ut = /* @__PURE__ */ O({
     }, w = async () => {
       i.value = !0, await m(), i.value = !1;
     }, _ = () => {
-      t.isSaveAsTemplateDrawerOpen = !0;
-    }, C = h(() => t.isVersionHistoryOpen ? s("newsletter.close-version-history") : s("newsletter.version-history")), A = h(
-      () => a.value?.features?.versionHistory && !t.isPreviewModeOpen
-    ), V = async (o) => {
-      r.value = !0, t.loadingStatus = !0;
-      const e = await u(o);
-      return r.value = !1, (o || !e) && (t.loadingStatus = !1), e;
-    }, E = (o) => {
-      if (!o && S.value) {
-        g.value?.open();
+      e.isSaveAsTemplateDrawerOpen = !0;
+    }, C = h(() => e.isVersionHistoryOpen ? s("newsletter.close-version-history") : s("newsletter.version-history")), A = h(
+      () => {
+        var t, o;
+        return ((o = (t = a.value) == null ? void 0 : t.features) == null ? void 0 : o.versionHistory) && !e.isPreviewModeOpen;
+      }
+    ), 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 V(o);
+      return V(t);
     }, M = async () => {
       if (l("liquidSyntax")) {
-        t.loadingStatus = !0;
+        e.loadingStatus = !0;
         try {
-          const { html: o } = await f({ minimize: !0, resetDataSavedFlag: !1 }), { compiledHtml: e } = d(o);
-          if (!await v(e))
+          const { html: t } = await f({ minimize: !0, resetDataSavedFlag: !1 }), { compiledHtml: o } = d(t);
+          if (!await v(o))
             return;
         } finally {
-          t.loadingStatus = !1;
+          e.loadingStatus = !1;
         }
       }
       H();
     };
     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: t, 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 };
+    }), { __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 {

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

@@ -1,17 +1,20 @@
-import { defineComponent as t, ref as n } from "vue";
-import { InContainer as m } from "@useinsider/design-system-vue";
-import a from "./LeftSlot.vue.js";
-import f from "./MiddleSlot.vue.js";
-import p from "./RightSlot.vue.js";
-const S = /* @__PURE__ */ t({
+import { defineComponent as n, ref as m } from "vue";
+import { InContainer as a } from "@useinsider/design-system-vue";
+import f from "./LeftSlot.vue.js";
+import p from "./MiddleSlot.vue.js";
+import i from "./RightSlot.vue.js";
+const c = /* @__PURE__ */ n({
   __name: "HeaderWrapper",
-  setup(i, { expose: o }) {
-    const e = n(null);
-    return o({
-      handleSave: (r) => e.value?.handleSave(r)
-    }), { __sfc: !0, rightSlotRef: e, InContainer: m, LeftSlot: a, MiddleSlot: f, RightSlot: p };
+  setup(l, { expose: r }) {
+    const e = m(null);
+    return r({
+      handleSave: (t) => {
+        var o;
+        return (o = e.value) == null ? void 0 : o.handleSave(t);
+      }
+    }), { __sfc: !0, rightSlotRef: e, InContainer: a, LeftSlot: f, MiddleSlot: p, RightSlot: i };
   }
 });
 export {
-  S as default
+  c as default
 };

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

@@ -1,16 +1,19 @@
-import { defineComponent as m, computed as f, ref as l } from "vue";
-import { useConfig as d } from "../../../composables/useConfig.js";
-import { useBack as p } from "../../../composables/useGuidoActions.js";
-import { usePreviewMode as k } from "../../../composables/usePreviewMode.js";
-import { useTranslations as B } from "../../../composables/useTranslations.js";
-import { useVersionHistoryApi as b } from "../../../composables/useVersionHistoryApi.js";
-import { useEditorStore as v } from "../../../stores/editor.js";
-import { InButtonV2 as _ } from "@useinsider/design-system-vue";
-import { useDebounceFn as V } from "../../../node_modules/@vueuse/shared/index.js";
-const A = /* @__PURE__ */ m({
+import { defineComponent as l, computed as d, ref as p } from "vue";
+import { useConfig as k } from "../../../composables/useConfig.js";
+import { useBack as B } from "../../../composables/useGuidoActions.js";
+import { usePreviewMode as b } from "../../../composables/usePreviewMode.js";
+import { useTranslations as v } from "../../../composables/useTranslations.js";
+import { useVersionHistoryApi as _ } from "../../../composables/useVersionHistoryApi.js";
+import { useEditorStore as V } from "../../../stores/editor.js";
+import { InButtonV2 as g } from "@useinsider/design-system-vue";
+import { useDebounceFn as w } from "../../../node_modules/@vueuse/shared/index.js";
+const D = /* @__PURE__ */ l({
   __name: "LeftSlot",
-  setup(g) {
-    const e = v(), i = p(), { closeVersionHistory: n } = b(), { closePreviewMode: s } = k(), o = B(), { config: t } = d(), u = f(() => e.isVersionHistoryOpen || e.isPreviewModeOpen ? o("email-editor.back-to-editor") : t.value?.ui?.backButtonLabel ? t.value.ui.backButtonLabel : o("email-editor.back-to-design")), r = l(!1), c = () => {
+  setup(y) {
+    const e = V(), i = B(), { closeVersionHistory: n } = _(), { closePreviewMode: s } = b(), o = v(), { config: t } = k(), f = d(() => {
+      var u, m;
+      return e.isVersionHistoryOpen || e.isPreviewModeOpen ? o("email-editor.back-to-editor") : (m = (u = t.value) == null ? void 0 : u.ui) != null && m.backButtonLabel ? t.value.ui.backButtonLabel : o("email-editor.back-to-design");
+    }), r = p(!1), c = () => {
       if (e.isVersionHistoryOpen) {
         n();
         return;
@@ -20,14 +23,14 @@ const A = /* @__PURE__ */ m({
         return;
       }
       e.loadingStatus = !0, i();
-    }, a = V(() => {
+    }, a = w(() => {
       c(), r.value = !1;
     }, 500);
-    return { __sfc: !0, editorStore: e, handleBack: i, closeVersionHistory: n, closePreviewMode: s, trans: o, config: t, backButtonLabel: u, isBackButtonDisabled: r, executeBackAction: c, debouncedBackAction: a, handleBackClick: () => {
+    return { __sfc: !0, editorStore: e, handleBack: i, closeVersionHistory: n, closePreviewMode: s, trans: o, config: t, backButtonLabel: f, isBackButtonDisabled: r, executeBackAction: c, debouncedBackAction: a, handleBackClick: () => {
       r.value = !0, a();
-    }, InButtonV2: _ };
+    }, InButtonV2: g };
   }
 });
 export {
-  A as default
+  D as default
 };

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

@@ -1,19 +1,16 @@
-import { defineComponent as e, defineAsyncComponent as o } from "vue";
-import m from "../email-preview/amp/AmpToggle.vue.js";
-import n from "../email-preview/desktop-preview/EmailSizeIndicator.vue.js";
-import { useEditorStore as s } from "../../../stores/editor.js";
-import p from "./EditorToolbar.vue.js";
-const u = /* @__PURE__ */ e({
+import { defineComponent as o } from "vue";
+import r from "../email-preview/amp/AmpToggle.vue.js";
+import t from "../email-preview/desktop-preview/EmailSizeIndicator.vue.js";
+import { useEditorStore as i } from "../../../stores/editor.js";
+import e from "./EditorToolbar.vue.js";
+import m from "./version-history/VersionHistory.vue.js";
+import p from "./version-history/ViewOptions.vue.js";
+const S = /* @__PURE__ */ o({
   __name: "MiddleSlot",
-  setup(f) {
-    const r = o(
-      () => import("./version-history/VersionHistory.vue.js")
-    ), t = o(
-      () => import("./version-history/ViewOptions.vue.js")
-    ), i = s();
-    return { __sfc: !0, VersionHistory: r, VersionHistoryViewOptions: t, editorStore: i, AmpToggle: m, EmailSizeIndicator: n, EditorToolbar: p };
+  setup(s) {
+    return { __sfc: !0, editorStore: i(), AmpToggle: r, EmailSizeIndicator: t, EditorToolbar: e, VersionHistory: m, VersionHistoryViewOptions: p };
   }
 });
 export {
-  u as default
+  S as default
 };

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

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

package/dist/components/organisms/onboarding/AMPOnboarding.vue.js

@@ -1,19 +1,20 @@
-import r from "./AMPOnboarding.vue2.js";
-import e from "../../../_virtual/_plugin-vue2_normalizer.js";
-var i = function() {
-  var n = this, t = n._self._c, o = n._self._setupProxy;
-  return o.isVisible ? t(o.InOnboard, { key: "guido__amp-onboard", staticClass: "w-21-s p-a z-11", class: o.onboardingStore.getAmpCurrentCard?.classes, attrs: { id: "guido__amp-onboard", "is-multiple-page": "", visible: "", "image-source": "", title: "", "bottom-position": o.onboardingStore.getAmpCurrentCard?.bottom, "left-position": o.onboardingStore.getAmpCurrentCard?.left, "pages-config": o.onboardingStore.onboardings.ampOnboarding.config, "pointer-position": o.onboardingStore.getAmpCurrentCard?.position, "right-position": o.onboardingStore.getAmpCurrentCard?.right, "top-position": o.onboardingStore.getAmpCurrentCard?.top }, on: { backButtonClick: o.handleBack, close: function(d) {
+import d from "./AMPOnboarding.vue2.js";
+import g from "../../../_virtual/_plugin-vue2_normalizer.js";
+var l = function() {
+  var t, r, e, i, a, s;
+  var n = this, p = n._self._c, o = n._self._setupProxy;
+  return o.isVisible ? p(o.InOnboard, { key: "guido__amp-onboard", staticClass: "w-21-s p-a z-11", class: (t = o.onboardingStore.getAmpCurrentCard) == null ? void 0 : t.classes, attrs: { id: "guido__amp-onboard", "is-multiple-page": "", visible: "", "image-source": "", title: "", "bottom-position": (r = o.onboardingStore.getAmpCurrentCard) == null ? void 0 : r.bottom, "left-position": (e = o.onboardingStore.getAmpCurrentCard) == null ? void 0 : e.left, "pages-config": o.onboardingStore.onboardings.ampOnboarding.config, "pointer-position": (i = o.onboardingStore.getAmpCurrentCard) == null ? void 0 : i.position, "right-position": (a = o.onboardingStore.getAmpCurrentCard) == null ? void 0 : a.right, "top-position": (s = o.onboardingStore.getAmpCurrentCard) == null ? void 0 : s.top }, on: { backButtonClick: o.handleBack, close: function(u) {
     return o.onboardingStore.close("ampOnboarding");
   }, nextButtonClick: o.handleNext } }) : n._e();
-}, a = [], s = /* @__PURE__ */ e(
-  r,
-  i,
-  a,
+}, m = [], c = /* @__PURE__ */ g(
+  d,
+  l,
+  m,
   !1,
   null,
   null
 );
-const m = s.exports;
+const f = c.exports;
 export {
-  m as default
+  f as default
 };

package/dist/components/organisms/onboarding/AMPOnboarding.vue2.js

@@ -1,35 +1,57 @@
-import { defineComponent as c, computed as t, watch as p } from "vue";
-import { useTranslations as m } from "../../../composables/useTranslations.js";
-import { useOnboardingStore as g } from "../../../stores/onboarding.js";
-import { InOnboard as u } from "@useinsider/design-system-vue";
-const k = /* @__PURE__ */ c({
+import { defineComponent as u, computed as d, watch as b, nextTick as f } from "vue";
+import { useTranslations as C } from "../../../composables/useTranslations.js";
+import { HEADER_SELECTOR as O, AMP_TOGGLE_BUTTON_SELECTOR as _, AMP_TOGGLE_WRAPPER_SELECTOR as T, POPOVER_LEFT_OFFSET as g, POPOVER_TOP_GAP as E } from "../../../enums/onboarding.js";
+import { useOnboardingStore as x } from "../../../stores/onboarding.js";
+import { InOnboard as P } from "@useinsider/design-system-vue";
+const G = /* @__PURE__ */ u({
   __name: "AMPOnboarding",
-  setup(b) {
-    const o = m(), n = g(), i = t(() => `${window.innerWidth / 2 - 110}px`), e = t(() => [
-      {
-        classes: "guido-amp-onboarding",
-        left: i.value,
-        top: "70px",
-        position: "Top Center",
-        title: o("email-editor.onboarding-amp-title"),
-        description: o("email-editor.onboarding-amp-description"),
-        imageSource: "",
-        backButtonClick: () => {
-        },
-        nextButtonType: "text",
-        nextButtonText: o("action-builder.ok"),
-        nextButtonClick: () => void n.close("ampOnboarding")
-      }
-    ]), r = t(() => n.onboardings.ampOnboarding.config.length > 0 && n.onboardings.ampOnboarding.isActive), a = () => {
-      n.getAmpCurrentCard?.nextButtonClick?.();
-    }, d = () => {
-      n.getAmpCurrentCard?.backButtonClick?.();
+  setup(R) {
+    const e = C(), o = x(), r = () => {
+      const t = document.querySelector(O), n = document.querySelector(_), c = n == null ? void 0 : n.closest(T);
+      if (!c || !t)
+        return {
+          left: `${((t == null ? void 0 : t.offsetWidth) ?? window.innerWidth) / 2 - g}px`,
+          top: "68px"
+        };
+      const s = t.getBoundingClientRect(), i = c.getBoundingClientRect();
+      return {
+        left: `${i.left - s.left + i.width / 2 - g}px`,
+        top: `${i.bottom - s.top + E}px`
+      };
+    }, a = d(() => {
+      const { left: t, top: n } = r();
+      return [
+        {
+          classes: "guido-amp-onboarding",
+          left: t,
+          top: n,
+          position: "Top Center",
+          title: e("email-editor.onboarding-amp-title"),
+          description: e("email-editor.onboarding-amp-description"),
+          imageSource: "",
+          backButtonClick: () => {
+          },
+          nextButtonType: "text",
+          nextButtonText: e("action-builder.ok"),
+          nextButtonClick: () => void o.close("ampOnboarding")
+        }
+      ];
+    }), l = d(() => o.onboardings.ampOnboarding.config.length > 0 && o.onboardings.ampOnboarding.isActive), p = () => {
+      var t, n;
+      (n = (t = o.getAmpCurrentCard) == null ? void 0 : t.nextButtonClick) == null || n.call(t);
+    }, m = () => {
+      var t, n;
+      (n = (t = o.getAmpCurrentCard) == null ? void 0 : t.backButtonClick) == null || n.call(t);
     };
-    return p(() => n.onboardings.ampOnboarding.isActive, (s) => {
-      s && n.setConfig("ampOnboarding", e.value);
-    }, { immediate: !0 }), { __sfc: !0, trans: o, onboardingStore: n, centerLeft: i, onboardingCardsConfig: e, isVisible: r, handleNext: a, handleBack: d, InOnboard: u };
+    return b(
+      () => o.onboardings.ampOnboarding.isActive,
+      async (t) => {
+        t && (await f(), o.setConfig("ampOnboarding", a.value));
+      },
+      { immediate: !0 }
+    ), { __sfc: !0, trans: e, onboardingStore: o, getTogglePosition: r, onboardingCardsConfig: a, isVisible: l, handleNext: p, handleBack: m, InOnboard: P };
   }
 });
 export {
-  k as default
+  G as default
 };

package/dist/components/organisms/onboarding/GenericOnboarding.vue.js

@@ -1,20 +1,21 @@
-import n from "./GenericOnboarding.vue2.js";
+import c from "./GenericOnboarding.vue2.js";
 /* empty css                       */
-import t from "../../../_virtual/_plugin-vue2_normalizer.js";
-var i = function() {
-  var o = this, r = o._self._c, e = o._self._setupProxy;
-  return e.isVisible ? r(e.InOnboard, { key: "guido__editor-onboard", staticClass: "w-21-s p-a z-11", class: e.onboardingStore.getGenericCurrentCard?.classes, attrs: { id: "guido__editor-onboard", "is-multiple-page": "", visible: "", "image-source": "", title: "", "bottom-position": e.onboardingStore.getGenericCurrentCard?.bottom, "left-position": e.onboardingStore.getGenericCurrentCard?.left, "pages-config": e.onboardingStore.onboardings.genericOnboarding.config, "pointer-position": e.onboardingStore.getGenericCurrentCard?.position, "right-position": e.onboardingStore.getGenericCurrentCard?.right, "top-position": e.onboardingStore.getGenericCurrentCard?.top }, on: { backButtonClick: e.handleBack, close: function(c) {
+import g from "../../../_virtual/_plugin-vue2_normalizer.js";
+var l = function() {
+  var r, n, t, i, a, s;
+  var o = this, d = o._self._c, e = o._self._setupProxy;
+  return e.isVisible ? d(e.InOnboard, { key: "guido__editor-onboard", staticClass: "w-21-s p-a z-11", class: (r = e.onboardingStore.getGenericCurrentCard) == null ? void 0 : r.classes, attrs: { id: "guido__editor-onboard", "is-multiple-page": "", visible: "", "image-source": "", title: "", "bottom-position": (n = e.onboardingStore.getGenericCurrentCard) == null ? void 0 : n.bottom, "left-position": (t = e.onboardingStore.getGenericCurrentCard) == null ? void 0 : t.left, "pages-config": e.onboardingStore.onboardings.genericOnboarding.config, "pointer-position": (i = e.onboardingStore.getGenericCurrentCard) == null ? void 0 : i.position, "right-position": (a = e.onboardingStore.getGenericCurrentCard) == null ? void 0 : a.right, "top-position": (s = e.onboardingStore.getGenericCurrentCard) == null ? void 0 : s.top }, on: { backButtonClick: e.handleBack, close: function(u) {
     return e.onboardingStore.close("genericOnboarding");
   }, nextButtonClick: e.handleNext } }) : o._e();
-}, a = [], s = /* @__PURE__ */ t(
-  n,
-  i,
-  a,
+}, p = [], _ = /* @__PURE__ */ g(
+  c,
+  l,
+  p,
   !1,
   null,
-  "29b9af29"
+  "7419ae06"
 );
-const _ = s.exports;
+const S = _.exports;
 export {
-  _ as default
+  S as default
 };

package/dist/components/organisms/onboarding/GenericOnboarding.vue2.js

@@ -1,32 +1,34 @@
-import { defineComponent as u, computed as n, watch as l } from "vue";
-import { useTranslations as b } from "../../../composables/useTranslations.js";
-import { SERVICE_HOVER_SELECTORS as x } from "../../../enums/onboarding.js";
-import { useOnboardingStore as m } from "../../../stores/onboarding.js";
-import { InOnboard as k } from "@useinsider/design-system-vue";
-const h = /* @__PURE__ */ u({
+import { defineComponent as l, computed as r, watch as m } from "vue";
+import { useRibbonOffset as x } from "../../../composables/useRibbonOffset.js";
+import { useTranslations as f } from "../../../composables/useTranslations.js";
+import { SERVICE_HOVER_SELECTORS as k } from "../../../enums/onboarding.js";
+import { useOnboardingStore as B } from "../../../stores/onboarding.js";
+import { InOnboard as C } from "@useinsider/design-system-vue";
+const y = /* @__PURE__ */ l({
   __name: "GenericOnboarding",
-  setup(f) {
-    const t = b(), e = m(), i = n(() => `${window.innerWidth / 2 - 160}px`), r = () => {
-      const o = document.querySelector("ui-editor");
-      o?.shadowRoot && x.forEach((p) => {
-        const s = o.shadowRoot?.querySelector(p);
-        s && s.classList.add("hover");
+  setup(T) {
+    const e = f(), o = B(), { getTopPosition: i } = x(), s = r(() => `${window.innerWidth / 2 - 146}px`), c = () => {
+      const t = document.querySelector("ui-editor");
+      t != null && t.shadowRoot && k.forEach((n) => {
+        var g;
+        const d = (g = t.shadowRoot) == null ? void 0 : g.querySelector(n);
+        d && d.classList.add("hover");
       });
-    }, c = n(() => [
+    }, a = r(() => [
       {
         classes: "guido-onboarding-blocks",
         left: "90px",
-        top: "90px",
+        top: i(90),
         position: "Left Top",
-        title: t("email-editor.onboarding-blocks-title"),
-        description: t("email-editor.onboarding-blocks-description"),
+        title: e("email-editor.onboarding-blocks-title"),
+        description: e("email-editor.onboarding-blocks-description"),
         imageSource: "",
         backButtonClick: () => {
         },
         nextButtonType: "text",
-        nextButtonText: t("products.next"),
+        nextButtonText: e("products.next"),
         nextButtonClick: () => {
-          r(), e.next("genericOnboarding");
+          c(), o.next("genericOnboarding");
         }
       },
       {
@@ -34,47 +36,49 @@ const h = /* @__PURE__ */ u({
         right: "426px",
         bottom: "38px",
         position: "Right Bottom",
-        title: t("email-editor.onboarding-stripes-title"),
-        description: t("email-editor.onboarding-stripes-description"),
+        title: e("email-editor.onboarding-stripes-title"),
+        description: e("email-editor.onboarding-stripes-description"),
         imageSource: "",
         backButtonType: "text",
-        backButtonText: t("ds-steps.back"),
+        backButtonText: e("ds-steps.back"),
         backButtonClick: () => {
-          e.previous("genericOnboarding");
+          o.previous("genericOnboarding");
         },
         nextButtonType: "text",
-        nextButtonText: t("products.next"),
+        nextButtonText: e("products.next"),
         nextButtonClick: () => {
-          e.next("genericOnboarding");
+          o.next("genericOnboarding");
         }
       },
       {
         classes: "guido-onboarding-preview",
-        left: i.value,
-        top: "90px",
+        left: s.value,
+        top: i(68),
         position: "Top Center",
-        title: t("email-editor.onboarding-preview-title"),
-        description: t("email-editor.onboarding-preview-description"),
+        title: e("email-editor.onboarding-preview-title"),
+        description: e("email-editor.onboarding-preview-description"),
         imageSource: "",
         backButtonType: "text",
-        backButtonText: t("ds-steps.back"),
-        backButtonClick: () => e.previous("genericOnboarding"),
+        backButtonText: e("ds-steps.back"),
+        backButtonClick: () => o.previous("genericOnboarding"),
         nextButtonType: "text",
-        nextButtonText: t("action-builder.ok"),
+        nextButtonText: e("action-builder.ok"),
         nextButtonClick: () => {
-          e.close("genericOnboarding");
+          o.close("genericOnboarding");
         }
       }
-    ]), a = n(() => e.onboardings.genericOnboarding.config.length > 0 && e.onboardings.genericOnboarding.isActive), d = () => {
-      e.getGenericCurrentCard?.nextButtonClick?.();
-    }, g = () => {
-      e.getGenericCurrentCard?.backButtonClick?.();
+    ]), p = r(() => o.onboardings.genericOnboarding.config.length > 0 && o.onboardings.genericOnboarding.isActive), u = () => {
+      var t, n;
+      (n = (t = o.getGenericCurrentCard) == null ? void 0 : t.nextButtonClick) == null || n.call(t);
+    }, b = () => {
+      var t, n;
+      (n = (t = o.getGenericCurrentCard) == null ? void 0 : t.backButtonClick) == null || n.call(t);
     };
-    return l(() => e.onboardings.genericOnboarding.isActive, (o) => {
-      o && e.setConfig("genericOnboarding", c.value);
-    }, { immediate: !0 }), { __sfc: !0, trans: t, onboardingStore: e, centerLeft: i, addHoverToServiceElements: r, onboardingCardsConfig: c, isVisible: a, handleNext: d, handleBack: g, InOnboard: k };
+    return m(() => o.onboardings.genericOnboarding.isActive, (t) => {
+      t && o.setConfig("genericOnboarding", a.value);
+    }, { immediate: !0 }), { __sfc: !0, trans: e, onboardingStore: o, getTopPosition: i, centerLeft: s, addHoverToServiceElements: c, onboardingCardsConfig: a, isVisible: p, handleNext: u, handleBack: b, InOnboard: C };
   }
 });
 export {
-  h as default
+  y as default
 };