@useinsider/guido 1.0.0-beta.5dcfb69 → 1.0.0-beta.5e50654

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/dist/@types/generic.d.ts +5 -3
  2. package/dist/components/Guido.vue.d.ts +1 -2
  3. package/dist/components/Guido.vue.js +8 -8
  4. package/dist/components/Guido.vue2.js +23 -26
  5. package/dist/components/organisms/header/MiddleSlot.vue.js +6 -6
  6. package/dist/components/organisms/header/MiddleSlot.vue2.js +15 -20
  7. package/dist/components/organisms/header/RightSlot.vue.js +7 -7
  8. package/dist/components/organisms/header/RightSlot.vue2.js +24 -22
  9. package/dist/components/organisms/header/ViewOptions.vue.js +6 -6
  10. package/dist/composables/useActionsApi.d.ts +0 -2
  11. package/dist/composables/useActionsApi.js +36 -47
  12. package/dist/guido.css +1 -1
  13. package/dist/stores/editor.d.ts +0 -3
  14. package/dist/stores/editor.js +3 -6
  15. package/dist/utils/tooltipUtils.d.ts +2 -0
  16. package/dist/utils/tooltipUtils.js +9 -0
  17. package/package.json +1 -1
  18. package/dist/components/organisms/design-preview/AmpErrorModal.vue.d.ts +0 -16
  19. package/dist/components/organisms/design-preview/AmpErrorModal.vue.js +0 -21
  20. package/dist/components/organisms/design-preview/AmpErrorModal.vue2.js +0 -30
  21. package/dist/components/organisms/design-preview/DesktopPreview.vue.d.ts +0 -16
  22. package/dist/components/organisms/design-preview/DesktopPreview.vue.js +0 -22
  23. package/dist/components/organisms/design-preview/DesktopPreview.vue2.js +0 -43
  24. package/dist/components/organisms/design-preview/EmailPreview.vue.d.ts +0 -16
  25. package/dist/components/organisms/design-preview/EmailPreview.vue.js +0 -17
  26. package/dist/components/organisms/design-preview/EmailPreview.vue2.js +0 -33
  27. package/dist/components/organisms/design-preview/EmailView.vue.d.ts +0 -18
  28. package/dist/components/organisms/design-preview/EmailView.vue.js +0 -19
  29. package/dist/components/organisms/design-preview/EmailView.vue2.js +0 -24
  30. package/dist/components/organisms/design-preview/InboxView.vue.d.ts +0 -17
  31. package/dist/components/organisms/design-preview/InboxView.vue.js +0 -19
  32. package/dist/components/organisms/design-preview/InboxView.vue2.js +0 -23
  33. package/dist/components/organisms/design-preview/MobilePreview.vue.d.ts +0 -17
  34. package/dist/components/organisms/design-preview/MobilePreview.vue.js +0 -17
  35. package/dist/components/organisms/design-preview/MobilePreview.vue2.js +0 -24
  36. package/dist/components/organisms/header/AmpToggle.vue.d.ts +0 -2
  37. package/dist/components/organisms/header/AmpToggle.vue.js +0 -17
  38. package/dist/components/organisms/header/AmpToggle.vue2.js +0 -48
  39. package/dist/composables/useDebounce.d.ts +0 -4
  40. package/dist/composables/useDebounce.js +0 -12
  41. package/dist/composables/useMobileGmailFit.d.ts +0 -5
  42. package/dist/composables/useMobileGmailFit.js +0 -69
  43. package/dist/enums/emailPreview.d.ts +0 -3
  44. package/dist/enums/emailPreview.js +0 -4
  45. package/dist/enums/gmailMobilePreview.d.ts +0 -7
  46. package/dist/enums/gmailMobilePreview.js +0 -17
  47. package/dist/static/assets/inbox-mockup.svg.js +0 -4
  48. package/dist/static/assets/phone-mockup.svg.js +0 -4
@@ -9,7 +9,9 @@ export type DynamicContent = {
9
9
  text: string;
10
10
  fallback?: string;
11
11
  };
12
- export interface EmailData {
13
- senderName: string;
14
- subject: string;
12
+ export interface TooltipOptions {
13
+ id: string;
14
+ dynamicPosition: boolean;
15
+ staticPosition: 'top' | 'bottom' | 'left' | 'right';
16
+ iconStatus: boolean;
15
17
  }
@@ -1,4 +1,4 @@
1
- import type { DynamicContent, GuidoConfig, EmailData } from '@@/Types/generic';
1
+ import type { DynamicContent, GuidoConfig } from '@@/Types/generic';
2
2
  import type { Template } from '@@/Types/stripo';
3
3
  type __VLS_Props = {
4
4
  templateId: string;
@@ -9,7 +9,6 @@ type __VLS_Props = {
9
9
  html?: string;
10
10
  css?: string;
11
11
  guidoConfig: GuidoConfig;
12
- emailData?: EmailData;
13
12
  };
14
13
  declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<__VLS_Props>, {
15
14
  dynamicContent: {
@@ -1,18 +1,18 @@
1
1
  import o from "./Guido.vue2.js";
2
2
  /* empty css */
3
- import t from "../_virtual/_plugin-vue2_normalizer.js";
3
+ import i from "../_virtual/_plugin-vue2_normalizer.js";
4
4
  var s = function() {
5
- var i = this, r = i._self._c, e = i._self._setupProxy;
6
- return r("div", { staticClass: "guido-editor__wrapper" }, [r(e.HeaderWrapper), r(e.EmailPreview, { directives: [{ name: "show", rawName: "v-show", value: e.editorStore.isPreviewModeOpen, expression: "editorStore.isPreviewModeOpen" }], attrs: { "email-data": i.emailData, "is-visible": e.editorStore.isPreviewModeOpen } }), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.editorStore.isPreviewModeOpen, expression: "!editorStore.isPreviewModeOpen" }], staticClass: "guido-editor__container", attrs: { id: "guido-editor" } })], 1);
7
- }, a = [], d = /* @__PURE__ */ t(
5
+ var e = this, r = e._self._c, t = e._self._setupProxy;
6
+ return r("div", { staticClass: "guido-editor__wrapper" }, [r(t.HeaderWrapper), r("div", { staticClass: "guido-editor__container", attrs: { id: "guido-editor" } })], 1);
7
+ }, _ = [], a = /* @__PURE__ */ i(
8
8
  o,
9
9
  s,
10
- a,
10
+ _,
11
11
  !1,
12
12
  null,
13
- "7836f831"
13
+ "89bedf08"
14
14
  );
15
- const m = d.exports;
15
+ const f = a.exports;
16
16
  export {
17
- m as default
17
+ f as default
18
18
  };
@@ -1,13 +1,11 @@
1
- import { defineComponent as w, onMounted as E } from "vue";
2
- import { provideGuidoActions as S } from "../composables/useGuidoActions.js";
3
- import { usePartner as D } from "../composables/usePartner.js";
4
- import { useStripo as _ } from "../composables/useStripo.js";
5
- import { DefaultUsername as G, DefaultGuidoConfig as I } from "../enums/defaults.js";
6
- import P from "./organisms/design-preview/EmailPreview.vue.js";
7
- import k from "./organisms/header/HeaderWrapper.vue.js";
8
- import { useStripoApi as T } from "../services/stripoApi.js";
9
- import { useEditorStore as N } from "../stores/editor.js";
10
- const M = /* @__PURE__ */ w({
1
+ import { defineComponent as h, onMounted as w } from "vue";
2
+ import { provideGuidoActions as D } from "../composables/useGuidoActions.js";
3
+ import { usePartner as E } from "../composables/usePartner.js";
4
+ import { useStripo as S } from "../composables/useStripo.js";
5
+ import { DefaultUsername as _, DefaultGuidoConfig as G } from "../enums/defaults.js";
6
+ import I from "./organisms/header/HeaderWrapper.vue.js";
7
+ import { useStripoApi as k } from "../services/stripoApi.js";
8
+ const B = /* @__PURE__ */ h({
11
9
  __name: "Guido",
12
10
  props: {
13
11
  templateId: null,
@@ -17,27 +15,26 @@ const M = /* @__PURE__ */ w({
17
15
  username: null,
18
16
  html: null,
19
17
  css: null,
20
- guidoConfig: null,
21
- emailData: null
18
+ guidoConfig: null
22
19
  },
23
20
  emits: ["dynamic-content:open", "back", "save:start", "save:complete"],
24
21
  setup(C, { expose: b, emit: t }) {
25
- const o = C, { getPartnerName: n, getProductType: a } = D(), {
22
+ const o = C, { getPartnerName: n, getProductType: a } = E(), {
26
23
  templateId: c,
27
- userId: r,
24
+ userId: s,
28
25
  guidoConfig: i,
29
- html: s = "",
26
+ html: r = "",
30
27
  css: l = "",
31
28
  partnerName: d = n(),
32
29
  productType: u = a(),
33
- username: m = G
30
+ username: m = _
34
31
  } = o;
35
32
  window.GuidoConfig = {
36
- ...I,
33
+ ...G,
37
34
  ...i
38
35
  };
39
- const { initPlugin: p } = _({ emailId: c, userId: r, username: m, partnerName: d, productType: u }), { getDefaultTemplate: f } = T(), h = N();
40
- S({
36
+ const { initPlugin: p } = S({ emailId: c, userId: s, username: m, partnerName: d, productType: u }), { getDefaultTemplate: g } = k();
37
+ D({
41
38
  onBack: () => {
42
39
  console.debug("guido:back"), t("back");
43
40
  },
@@ -48,21 +45,21 @@ const M = /* @__PURE__ */ w({
48
45
  console.debug("guido:save:complete", e), t("save:complete", e);
49
46
  }
50
47
  });
51
- const g = (e) => {
48
+ const f = (e) => {
52
49
  console.debug("dynamic-content:close", e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
53
50
  }, y = () => {
54
51
  console.debug("dynamic-content:close", "Without Data"), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: { text: "", value: "" } }));
55
52
  };
56
- return E(async () => {
53
+ return w(async () => {
57
54
  console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow");
58
55
  try {
59
56
  let e = {
60
- html: s,
57
+ html: r,
61
58
  css: l,
62
59
  forceRecreate: !0
63
60
  // TODO: It should be false for old templates. We will communicate with Stripo
64
61
  };
65
- e.html || (e = await f()), await p(e);
62
+ e.html || (e = await g()), await p(e);
66
63
  } catch (e) {
67
64
  console.error("Failed to initialize Stripo editor:", e);
68
65
  }
@@ -72,12 +69,12 @@ const M = /* @__PURE__ */ w({
72
69
  });
73
70
  }), b({
74
71
  dynamicContent: {
75
- insert: g,
72
+ insert: f,
76
73
  close: y
77
74
  }
78
- }), { __sfc: !0, props: o, getPartnerName: n, getProductType: a, templateId: c, userId: r, guidoConfig: i, html: s, css: l, partnerName: d, productType: u, username: m, emit: t, initPlugin: p, getDefaultTemplate: f, editorStore: h, insertDynamicContent: g, closeDynamicContent: y, EmailPreview: P, HeaderWrapper: k };
75
+ }), { __sfc: !0, props: o, getPartnerName: n, getProductType: a, templateId: c, userId: s, guidoConfig: i, html: r, css: l, partnerName: d, productType: u, username: m, emit: t, initPlugin: p, getDefaultTemplate: g, insertDynamicContent: f, closeDynamicContent: y, HeaderWrapper: I };
79
76
  }
80
77
  });
81
78
  export {
82
- M as default
79
+ B as default
83
80
  };
@@ -1,10 +1,10 @@
1
- import s from "./MiddleSlot.vue2.js";
2
- import i from "../../../_virtual/_plugin-vue2_normalizer.js";
1
+ import i from "./MiddleSlot.vue2.js";
2
+ import s from "../../../_virtual/_plugin-vue2_normalizer.js";
3
3
  var n = function() {
4
- var o = this, e = o._self._c, t = o._self._setupProxy;
5
- return t.editorStore.isVersionHistoryOpen ? e("div", { staticClass: "d-f" }, [e(t.VersionHistory), e(t.VersionHistoryViewOptions)], 1) : e("div", { staticClass: "d-f" }, [e(t.InButtonV2, { attrs: { id: "guido__undo-button", "left-icon": "line-undo", styling: "ghost", type: "secondary", "disabled-status": t.isPreviewModeOpen, "label-text-status": !1 } }), e(t.InButtonV2, { attrs: { id: "guido__redo-button", "left-icon": "line-redo", styling: "ghost", type: "secondary", "disabled-status": t.isPreviewModeOpen, "label-text-status": !1 } }), e(t.InButtonV2, { attrs: { id: "guido__code-button", "data-testid": "Code Editor", "left-icon": "line-code", styling: "ghost", "tooltip-text": "Code Editor", type: "secondary", "disabled-status": t.isPreviewModeOpen, "label-text-status": !1, "selected-status": t.editorStore.isCodeEditorOpen, "tooltip-options": t.getTooltipOptions("guido__code-button") } }), e(t.InButtonV2, { attrs: { id: "guido__preview-button", "left-icon": "line-show-on", styling: "ghost", type: "secondary", "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__preview-button"), "tooltip-text": t.isPreviewModeOpen ? t.trans("newsletter.close-email-preview") : t.trans("newsletter.email-preview") }, on: { click: t.handlePreviewClick } }), e(t.ViewOptions, { staticClass: "ml-3" }), e(t.AmpToggle)], 1);
6
- }, l = [], r = /* @__PURE__ */ i(
7
- s,
4
+ var e = this, o = e._self._c, t = e._self._setupProxy;
5
+ return t.editorStore.isVersionHistoryOpen ? o("div", { staticClass: "d-f" }, [o(t.VersionHistory), o(t.VersionHistoryViewOptions)], 1) : o("div", { staticClass: "d-f" }, [o(t.InButtonV2, { attrs: { id: "guido__undo-button", "left-icon": "line-undo", styling: "ghost", type: "secondary", "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__undo-button"), "tooltip-text": t.trans("action-builder.undo") } }), o(t.InButtonV2, { attrs: { id: "guido__redo-button", "left-icon": "line-redo", styling: "ghost", type: "secondary", "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__redo-button"), "tooltip-text": t.trans("action-builder.redo") } }), o(t.InButtonV2, { attrs: { id: "guido__code-button", "data-testid": "Code Editor", "left-icon": "line-code", styling: "ghost", type: "secondary", "label-text-status": !1, "selected-status": t.editorStore.isCodeEditorOpen, "tooltip-options": t.getTooltipOptions("guido__code-button"), "tooltip-text": t.codeEditorTooltipText } }), o(t.InButtonV2, { attrs: { id: "guido__preview-button", "left-icon": "line-show-on", styling: "ghost", type: "secondary", "label-text-status": !1, "selected-status": t.editorStore.isPreviewModeOpen, "tooltip-options": t.getTooltipOptions("guido__preview-button"), "tooltip-text": t.previewTooltipText }, on: { click: t.handlePreview } }), o(t.ViewOptions, { staticClass: "ml-3" })], 1);
6
+ }, l = [], r = /* @__PURE__ */ s(
7
+ i,
8
8
  n,
9
9
  l,
10
10
  !1,
@@ -1,25 +1,20 @@
1
- import { defineComponent as s, computed as n } from "vue";
2
- import { useTranslations as p } from "../../../composables/useTranslations.js";
3
- import { useEditorStore as m } from "../../../stores/editor.js";
4
- import { InButtonV2 as c } from "@useinsider/design-system-vue";
5
- import d from "./AmpToggle.vue.js";
6
- import f from "./version-history/VersionHistory.vue.js";
7
- import a from "./version-history/ViewOptions.vue.js";
8
- import l from "./ViewOptions.vue.js";
9
- const T = /* @__PURE__ */ s({
1
+ import { defineComponent as s, computed as t } from "vue";
2
+ import { useTranslations as n } from "../../../composables/useTranslations.js";
3
+ import { useEditorStore as p } from "../../../stores/editor.js";
4
+ import { getTooltipOptions as m } from "../../../utils/tooltipUtils.js";
5
+ import { InButtonV2 as l } from "@useinsider/design-system-vue";
6
+ import d from "./version-history/VersionHistory.vue.js";
7
+ import w from "./version-history/ViewOptions.vue.js";
8
+ import c from "./ViewOptions.vue.js";
9
+ const M = /* @__PURE__ */ s({
10
10
  __name: "MiddleSlot",
11
- setup(u) {
12
- const o = m(), t = p(), e = () => {
13
- o.isPreviewModeOpen = !o.isPreviewModeOpen;
14
- }, i = n(() => o.isPreviewModeOpen);
15
- return { __sfc: !0, editorStore: o, trans: t, handlePreviewClick: e, isPreviewModeOpen: i, getTooltipOptions: (r) => ({
16
- id: `${r}-tooltip`,
17
- dynamicPosition: !1,
18
- staticPosition: "bottom center",
19
- iconStatus: !1
20
- }), InButtonV2: c, AmpToggle: d, VersionHistory: f, VersionHistoryViewOptions: a, ViewOptions: l };
11
+ setup(f) {
12
+ const e = p(), o = n(), r = t(() => e.isCodeEditorOpen ? o("newsletter.close-html-editor") : o("newsletter.html-editor")), i = t(() => e.isPreviewModeOpen ? o("newsletter.close-email-preview") : o("newsletter.email-preview"));
13
+ return { __sfc: !0, editorStore: e, trans: o, codeEditorTooltipText: r, previewTooltipText: i, handlePreview: () => {
14
+ e.isPreviewModeOpen = !e.isPreviewModeOpen;
15
+ }, getTooltipOptions: m, InButtonV2: l, VersionHistory: d, VersionHistoryViewOptions: w, ViewOptions: c };
21
16
  }
22
17
  });
23
18
  export {
24
- T as default
19
+ M as default
25
20
  };
@@ -1,17 +1,17 @@
1
- import o from "./RightSlot.vue2.js";
1
+ import s from "./RightSlot.vue2.js";
2
2
  import i from "../../../_virtual/_plugin-vue2_normalizer.js";
3
3
  var n = function() {
4
- var s = this, e = s._self._c, t = s._self._setupProxy;
5
- return e("div", { staticClass: "d-f" }, [e(t.InButtonV2, { attrs: { id: "guido__history-button", "left-icon": "line-architect-version-history", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isPreviewModeOpen, "label-text-status": !1, "selected-status": t.editorStore.isVersionHistoryOpen }, on: { click: t.handleVersionHistory } }), e(t.InButtonV2, { attrs: { id: "guido__export-button", "left-icon": "line-export", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryOpen, "label-text-status": !1 }, on: { click: t.exportHtml } }), e(t.InButtonV2, { attrs: { id: "guido__save-as-button", "left-icon": "line-newsletter-save-as-template", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryOpen, "label-text-status": !1 } }), e(t.InButtonV2, { attrs: { id: "guido__test-button", "left-icon": "line-architect-test-journey", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryOpen, "label-text-status": !1 } }), e(t.InButtonV2, { staticClass: "ml-3", attrs: { id: "guido__save-button", "label-text": "Save", "disabled-status": t.editorStore.isVersionHistoryOpen || t.editorStore.isPreviewModeOpen }, on: { click: t.handleSave } })], 1);
6
- }, r = [], a = /* @__PURE__ */ i(
7
- o,
4
+ var o = this, e = o._self._c, t = o._self._setupProxy;
5
+ return e("div", { staticClass: "d-f" }, [e(t.InButtonV2, { attrs: { id: "guido__history-button", "left-icon": "line-architect-version-history", styling: "ghost", type: "secondary", "label-text-status": !1, "selected-status": t.editorStore.isVersionHistoryOpen, "tooltip-options": t.getTooltipOptions("guido__history-button"), "tooltip-text": t.versionHistoryTooltipText }, on: { click: t.handleVersionHistory } }), e(t.InButtonV2, { attrs: { id: "guido__export-button", "left-icon": "line-export", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryOpen, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__export-button"), "tooltip-text": t.trans("newsletter.export") }, on: { click: t.exportHtml } }), e(t.InButtonV2, { attrs: { id: "guido__save-as-button", "left-icon": "line-newsletter-save-as-template", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryOpen, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__save-as-button"), "tooltip-text": t.trans("newsletter.save-templates") } }), e(t.InButtonV2, { attrs: { id: "guido__test-button", "left-icon": "line-architect-test-journey", styling: "ghost", type: "secondary", "disabled-status": t.editorStore.isVersionHistoryOpen, "label-text-status": !1, "tooltip-options": t.getTooltipOptions("guido__test-button"), "tooltip-text": t.trans("newsletter.test-email") } }), e(t.InButtonV2, { staticClass: "ml-3", attrs: { id: "guido__save-button", "label-text": "Save", "disabled-status": t.editorStore.isVersionHistoryOpen }, on: { click: t.handleSave } })], 1);
6
+ }, r = [], l = /* @__PURE__ */ i(
7
+ s,
8
8
  n,
9
9
  r,
10
10
  !1,
11
11
  null,
12
12
  null
13
13
  );
14
- const c = a.exports;
14
+ const u = l.exports;
15
15
  export {
16
- c as default
16
+ u as default
17
17
  };
@@ -1,35 +1,37 @@
1
- import { defineComponent as m } from "vue";
2
- import { useActionsApi as p } from "../../../composables/useActionsApi.js";
3
- import { useExport as c } from "../../../composables/useExport.js";
4
- import { useSaveStart as l, useSaveComplete as f } from "../../../composables/useGuidoActions.js";
5
- import { useVersionHistoryApi as u } from "../../../composables/useVersionHistoryApi.js";
6
- import { useEditorStore as d } from "../../../stores/editor.js";
7
- import { InButtonV2 as S } from "@useinsider/design-system-vue";
8
- const E = /* @__PURE__ */ m({
1
+ import { defineComponent as l, computed as f } from "vue";
2
+ import { useActionsApi as u } from "../../../composables/useActionsApi.js";
3
+ import { useExport as d } from "../../../composables/useExport.js";
4
+ import { useSaveStart as y, useSaveComplete as v } from "../../../composables/useGuidoActions.js";
5
+ import { useTranslations as h } from "../../../composables/useTranslations.js";
6
+ import { useVersionHistoryApi as S } from "../../../composables/useVersionHistoryApi.js";
7
+ import { useEditorStore as H } from "../../../stores/editor.js";
8
+ import { getTooltipOptions as _ } from "../../../utils/tooltipUtils.js";
9
+ import { InButtonV2 as V } from "@useinsider/design-system-vue";
10
+ const R = /* @__PURE__ */ l({
9
11
  __name: "RightSlot",
10
- setup(h) {
11
- const { exportHtml: a } = c(), { getCompiledEmail: t } = p(), e = l(), r = f(), { openVersionHistory: s, closeVersionHistory: n } = u(), i = d();
12
- return { __sfc: !0, exportHtml: a, getCompiledEmail: t, saveStart: e, saveComplete: r, openVersionHistory: s, closeVersionHistory: n, editorStore: i, handleVersionHistory: () => {
13
- if (i.isVersionHistoryOpen) {
14
- n();
12
+ setup(g) {
13
+ const { exportHtml: p } = d(), { getCompiledEmail: r } = u(), s = y(), i = v(), { openVersionHistory: n, closeVersionHistory: m } = S(), o = H(), t = h(), a = () => {
14
+ if (o.isVersionHistoryOpen) {
15
+ m();
15
16
  return;
16
17
  }
18
+ n();
19
+ }, c = f(() => o.isVersionHistoryOpen ? t("newsletter.close-version-history") : t("newsletter.version-history"));
20
+ return { __sfc: !0, exportHtml: p, getCompiledEmail: r, saveStart: s, saveComplete: i, openVersionHistory: n, closeVersionHistory: m, editorStore: o, trans: t, handleVersionHistory: a, versionHistoryTooltipText: c, handleSave: async () => {
17
21
  s();
18
- }, handleSave: async () => {
19
- e();
20
22
  try {
21
- const { html: o } = await t();
22
- r({
23
- html: o || "",
23
+ const { html: e } = await r();
24
+ i({
25
+ html: e || "",
24
26
  css: ""
25
27
  // CSS is embedded in HTML from Stripo
26
28
  });
27
- } catch (o) {
28
- console.error("Failed to get template data for save:", o);
29
+ } catch (e) {
30
+ console.error("Failed to get template data for save:", e);
29
31
  }
30
- }, InButtonV2: S };
32
+ }, getTooltipOptions: _, InButtonV2: V };
31
33
  }
32
34
  });
33
35
  export {
34
- E as default
36
+ R as default
35
37
  };
@@ -1,16 +1,16 @@
1
1
  import r from "./ViewOptions.vue2.js";
2
2
  /* empty css */
3
- import i from "../../../_virtual/_plugin-vue2_normalizer.js";
4
- var s = function() {
3
+ import s from "../../../_virtual/_plugin-vue2_normalizer.js";
4
+ var n = function() {
5
5
  var t = this, o = t._self._c, e = t._self._setupProxy;
6
- return o(e.InSegments, { attrs: { id: "guido__view-option-selection", "with-icon": "", disable: e.editorStore.isPreviewModeOpen, "segment-list": e.segmentList, selected: e.editorStore.editorVisualMode } });
7
- }, n = [], _ = /* @__PURE__ */ i(
6
+ return o(e.InSegments, { attrs: { id: "guido__view-option-selection", "with-icon": "", "segment-list": e.segmentList, selected: e.editorStore.editorVisualMode } });
7
+ }, i = [], _ = /* @__PURE__ */ s(
8
8
  r,
9
- s,
10
9
  n,
10
+ i,
11
11
  !1,
12
12
  null,
13
- "f90d31ea"
13
+ "0fff376c"
14
14
  );
15
15
  const l = _.exports;
16
16
  export {
@@ -1,7 +1,5 @@
1
- import type { CompileEmailOptions } from '@@/Types/stripo';
2
1
  import { GetCompiledEmailOptions, CompiledEmailResult } from '@@/Types/actions-api';
3
2
  export declare const useActionsApi: () => {
4
3
  getCompiledEmail: (options?: GetCompiledEmailOptions) => Promise<CompiledEmailResult>;
5
4
  activateCustomViewStyles: (isActive?: boolean) => void;
6
- getPreviewData: (options?: CompileEmailOptions) => Promise<CompiledEmailResult>;
7
5
  };
@@ -1,49 +1,38 @@
1
- const w = () => {
2
- const a = (e = {}) => new Promise((t, s) => {
3
- const m = { ...{
4
- minimize: !0,
5
- utmEntity: {
6
- utmSource: "",
7
- utmMedium: "",
8
- utmCampaign: "",
9
- utmContent: "",
10
- utmTerm: "",
11
- customUtms: [
12
- {
13
- name1: "val1",
14
- name2: "val2"
15
- }
16
- ]
17
- },
18
- mergeTags: ["Tag1", "Tag2"],
19
- forseAmp: !1,
20
- resetDataSavedFlag: !1,
21
- disableLineHeightsReplace: !0
22
- }, ...e }, o = {
23
- callback: (i, n, l, r, c) => {
24
- i ? s(i) : t({
25
- html: n,
26
- ampHtml: l,
27
- ampErrors: r,
28
- displayConditions: c
29
- });
30
- },
31
- ...m
32
- };
33
- window.StripoEditorApi.actionsApi.compileEmail(o);
34
- });
35
- return { getCompiledEmail: a, activateCustomViewStyles: (e = !0) => {
36
- window.StripoEditorApi.actionsApi.activateCustomViewStyles(e);
37
- }, getPreviewData: async (e) => {
38
- const t = await a({ minimize: !1, resetDataSavedFlag: !1, ...e });
39
- return {
40
- html: t.html,
41
- ampHtml: t.ampHtml ?? "",
42
- ampErrors: t.ampErrors ?? null,
43
- displayConditions: t.displayConditions
44
- };
45
- } };
46
- };
1
+ const g = () => ({ getCompiledEmail: (t = {}) => new Promise((i, a) => {
2
+ const s = { ...{
3
+ minimize: !0,
4
+ utmEntity: {
5
+ utmSource: "",
6
+ utmMedium: "",
7
+ utmCampaign: "",
8
+ utmContent: "",
9
+ utmTerm: "",
10
+ customUtms: [
11
+ {
12
+ name1: "val1",
13
+ name2: "val2"
14
+ }
15
+ ]
16
+ },
17
+ mergeTags: ["Tag1", "Tag2"],
18
+ forseAmp: !1,
19
+ resetDataSavedFlag: !1,
20
+ disableLineHeightsReplace: !0
21
+ }, ...t }, o = {
22
+ callback: (e, m, l, n, c) => {
23
+ e ? a(e) : i({
24
+ html: m,
25
+ ampHtml: l,
26
+ ampErrors: n,
27
+ displayConditions: c
28
+ });
29
+ },
30
+ ...s
31
+ };
32
+ window.StripoEditorApi.actionsApi.compileEmail(o);
33
+ }), activateCustomViewStyles: (t = !0) => {
34
+ window.StripoEditorApi.actionsApi.activateCustomViewStyles(t);
35
+ } });
47
36
  export {
48
- w as useActionsApi
37
+ g as useActionsApi
49
38
  };
package/dist/guido.css CHANGED
@@ -1 +1 @@
1
- [data-v-a66d80ed] .in-progress-wrapper__progress p span:last-child{display:none!important}.desktop-preview-container[data-v-a66d80ed],[data-v-a66d80ed] .desktop-preview-container .in-container{min-height:720px!important;height:100%}.version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history-wrapper[data-v-52a77eec]{gap:8px}[data-v-6a2bde67] .guido__verion-history-view-option-selection-desktop svg,[data-v-6a2bde67] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-6a2bde67] .in-segments-wrapper__button_selected,[data-v-6a2bde67] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-f90d31ea] .guido__view-option-selection-desktop svg,[data-v-f90d31ea] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-f90d31ea] .in-segments-wrapper__button_selected,[data-v-f90d31ea] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.guido-editor__wrapper[data-v-7836f831],.guido-editor__container[data-v-7836f831]{width:100%;height:calc(100vh - 75px)}
1
+ .version-history-item[data-v-ee4b9c3f]{flex-basis:200px}.version-history-wrapper[data-v-52a77eec]{gap:8px}[data-v-6a2bde67] .guido__verion-history-view-option-selection-desktop svg,[data-v-6a2bde67] .guido__verion-history-view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-6a2bde67] .in-segments-wrapper__button_selected,[data-v-6a2bde67] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}[data-v-0fff376c] .guido__view-option-selection-desktop svg,[data-v-0fff376c] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-0fff376c] .in-segments-wrapper__button_selected,[data-v-0fff376c] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.guido-editor__wrapper[data-v-89bedf08],.guido-editor__container[data-v-89bedf08]{width:100%;height:calc(100vh - 75px)}
@@ -3,7 +3,4 @@ export declare const useEditorStore: import("pinia").StoreDefinition<"editor", {
3
3
  isVersionHistoryOpen: boolean;
4
4
  isPreviewModeOpen: boolean;
5
5
  editorVisualMode: string;
6
- emailFormat: "html" | "amp";
7
- ampHtml: string | null;
8
- ampErrors: string[] | null;
9
6
  }, {}, {}>;
@@ -1,15 +1,12 @@
1
1
  import { defineStore as e } from "pinia";
2
- const r = e("editor", {
2
+ const i = e("editor", {
3
3
  state: () => ({
4
4
  isCodeEditorOpen: !1,
5
5
  isVersionHistoryOpen: !1,
6
6
  isPreviewModeOpen: !1,
7
- editorVisualMode: "desktop",
8
- emailFormat: "amp",
9
- ampHtml: null,
10
- ampErrors: null
7
+ editorVisualMode: "desktop"
11
8
  })
12
9
  });
13
10
  export {
14
- r as useEditorStore
11
+ i as useEditorStore
15
12
  };
@@ -0,0 +1,2 @@
1
+ import type { TooltipOptions } from '../@types/generic';
2
+ export declare const getTooltipOptions: (id: string, options?: Partial<Omit<TooltipOptions, "id">>) => TooltipOptions;
@@ -0,0 +1,9 @@
1
+ const o = (i, t = {}) => ({
2
+ id: i,
3
+ dynamicPosition: t.dynamicPosition ?? !0,
4
+ staticPosition: t.staticPosition ?? "bottom",
5
+ iconStatus: t.iconStatus ?? !1
6
+ });
7
+ export {
8
+ o as getTooltipOptions
9
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useinsider/guido",
3
- "version": "1.0.0-beta.5dcfb69",
3
+ "version": "1.0.0-beta.5e50654",
4
4
  "description": "Guido is a Vue + TypeScript wrapper for Email Plugin. Easily embed the email editor in your Vue applications.",
5
5
  "main": "./dist/guido.umd.cjs",
6
6
  "module": "./dist/library.js",
@@ -1,16 +0,0 @@
1
- interface Props {
2
- errors: string[];
3
- }
4
- declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<Props>, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {
5
- close: () => void;
6
- }, string, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<Props>>>, {}>;
7
- export default _default;
8
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
9
- type __VLS_TypePropsToOption<T> = {
10
- [K in keyof T]-?: {} extends Pick<T, K> ? {
11
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
12
- } : {
13
- type: import('vue').PropType<T[K]>;
14
- required: true;
15
- };
16
- };
@@ -1,21 +0,0 @@
1
- import n from "./AmpErrorModal.vue2.js";
2
- import a from "../../../_virtual/_plugin-vue2_normalizer.js";
3
- var i = function() {
4
- var e = this, o = e._self._c, t = e._self._setupProxy;
5
- return o(t.InModalV2, { attrs: { id: "amp-error-modal", "close-button-status": "", "close-on-outside-click": "", "description-status": "", "footer-status": "", status: "", size: "medium", "description-text": t.trans("email-editor.amp-validation-description"), "footer-button-group-options": t.footerButtonOptions, "title-text": t.trans("email-editor.amp-validation-title") }, on: { cancelOrBackButtonEvent: t.handleClose, onCloseEvent: t.handleClose, primaryButtonEvent: t.handleFixInCodeEditor }, scopedSlots: e._u([{ key: "contentSlot", fn: function() {
6
- return [o("div", { staticClass: "d-f f-d-c" }, [o("div", { staticClass: "mb-3" }, [o("div", { staticClass: "l-s-5 f-s-1 f-w-600 t-c-55 t-t-u" }, [e._v(" " + e._s(`${t.trans("products.errors")}(${t.errorCount})`) + " ")])]), o("div", { staticClass: "d-f f-d-c g-13 max-h-21-s o-y-a", staticStyle: { gap: "16px" } }, e._l(t.props.errors, function(s, r) {
7
- return o(t.InOnPageMessage, { key: r, attrs: { icon: "filled-error-box", size: "medium", type: "alert", text: s } });
8
- }), 1)])];
9
- }, proxy: !0 }]) });
10
- }, l = [], d = /* @__PURE__ */ a(
11
- n,
12
- i,
13
- l,
14
- !1,
15
- null,
16
- null
17
- );
18
- const f = d.exports;
19
- export {
20
- f as default
21
- };
@@ -1,30 +0,0 @@
1
- import { defineComponent as m } from "vue";
2
- import { useToaster as f } from "../../../composables/useToaster.js";
3
- import { useTranslations as u } from "../../../composables/useTranslations.js";
4
- import { useEditorStore as E } from "../../../stores/editor.js";
5
- import { InOnPageMessage as g, InModalV2 as y } from "@useinsider/design-system-vue";
6
- const x = /* @__PURE__ */ m({
7
- __name: "AmpErrorModal",
8
- props: {
9
- errors: null
10
- },
11
- emits: ["close"],
12
- setup(a, { emit: o }) {
13
- const r = a, e = u(), t = E(), { showToaster: i } = f(), p = r.errors.length, d = () => {
14
- o("close");
15
- }, l = () => {
16
- var n, s;
17
- o("close"), t.isPreviewModeOpen = !1, (s = (n = window.StripoEditorApi) == null ? void 0 : n.codeEditorApi) != null && s.openCodeEditor ? window.StripoEditorApi.codeEditorApi.openCodeEditor() : i({
18
- type: "error",
19
- message: "StripoEditorApi codeEditorApi not available"
20
- });
21
- }, c = {
22
- primaryButton: { type: "primary", labelText: e("email-editor.amp-validation-fix") },
23
- cancelOrBackButton: { type: "secondary", labelText: e("campaign-builder.cancel"), styling: "ghost" }
24
- };
25
- return { __sfc: !0, props: r, emit: o, trans: e, editorStore: t, showToaster: i, errorCount: p, handleClose: d, handleFixInCodeEditor: l, footerButtonOptions: c, InModalV2: y, InOnPageMessage: g };
26
- }
27
- });
28
- export {
29
- x as default
30
- };
@@ -1,16 +0,0 @@
1
- import type { EmailData } from '@@/Types/generic';
2
- interface Props {
3
- emailHtml: string;
4
- emailData?: EmailData;
5
- }
6
- declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<Props>, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<Props>>>, {}>;
7
- export default _default;
8
- type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
9
- type __VLS_TypePropsToOption<T> = {
10
- [K in keyof T]-?: {} extends Pick<T, K> ? {
11
- type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
12
- } : {
13
- type: import('vue').PropType<T[K]>;
14
- required: true;
15
- };
16
- };
@@ -1,22 +0,0 @@
1
- import i from "./DesktopPreview.vue2.js";
2
- /* empty css */
3
- import a from "../../../_virtual/_plugin-vue2_normalizer.js";
4
- var r = function() {
5
- var e = this, t = e._self._c, s = e._self._setupProxy;
6
- return t("div", { ref: "containerRef", staticStyle: { "min-height": "720px", height: "80vh" } }, [t(s.InContainer, { staticClass: "s-2 m-b-5 desktop-preview-container", attrs: { "full-width-content-status": "", "header-status": "", "border-radius": "bor-r-1", "container-type": "default", "footer-status": !1 }, scopedSlots: e._u([{ key: "headerLeftSlot", fn: function() {
7
- return [t("div", { staticClass: "d-f a-i-c j-c-s-b w-1" }, [t("div", { staticClass: "d-f a-i-c" }, [t("div", { staticClass: "b-c-49 bor-r-100 w-5-s h-5-s d-f a-i-c j-c-c" }, [t(s.InIcons, { attrs: { name: "line-menu-profile" } })], 1), t("div", { staticClass: "d-f f-d-c ml-2" }, [t("p", { staticClass: "t-c-53 f-w-600 f-s-1 l-h-1" }, [e._v(" " + e._s(s.senderName) + " ")]), t("p", { staticClass: "t-c-55 f-w-400 f-s-12 l-h-1" }, [e._v(" " + e._s(s.subject) + " ")])])])])];
8
- }, proxy: !0 }, { key: "headerRightSlot", fn: function() {
9
- return [t("div", { staticClass: "d-f a-i-c j-c-c" }, [t(s.InProgress, { staticClass: "min-w-15-s", attrs: { id: "email-size-progress", "description-status": "", "description-position": "left", description: s.emailSize, "max-value": s.MAX_EMAIL_WEIGHT, type: s.progressType, value: s.progressValue } }), t(s.InTooltip, { staticClass: "d-f ml-1", attrs: { id: "email-size-tooltip", align: "center", position: "bottom", text: s.trans("email-editor.preview-design-size-tooltip") } })], 1)];
10
- }, proxy: !0 }]) }, [t("iframe", { staticClass: "email-iframe w-1 bor-w-0", style: { height: s.iframeHeight }, attrs: { sandbox: "allow-same-origin allow-popups allow-forms allow-scripts", srcdoc: e.emailHtml } })])], 1);
11
- }, o = [], l = /* @__PURE__ */ a(
12
- i,
13
- r,
14
- o,
15
- !1,
16
- null,
17
- "a66d80ed"
18
- );
19
- const p = l.exports;
20
- export {
21
- p as default
22
- };