@useinsider/guido 1.0.2-beta.a06a05e → 1.0.2-beta.a71d19d

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 (32) hide show
  1. package/README.md +0 -7
  2. package/dist/@types/generic.d.ts +0 -4
  3. package/dist/components/Guido.vue.d.ts +1 -3
  4. package/dist/components/Guido.vue.js +5 -5
  5. package/dist/components/Guido.vue2.js +65 -76
  6. package/dist/components/organisms/LoadingWrapper.vue.js +1 -1
  7. package/dist/components/organisms/email-preview/amp/AmpToggle.vue.js +2 -3
  8. package/dist/components/organisms/header/HeaderWrapper.vue.d.ts +1 -3
  9. package/dist/components/organisms/header/HeaderWrapper.vue.js +6 -6
  10. package/dist/components/organisms/header/HeaderWrapper.vue2.js +9 -15
  11. package/dist/components/organisms/header/RightSlot.vue.d.ts +1 -3
  12. package/dist/components/organisms/header/RightSlot.vue.js +3 -5
  13. package/dist/components/organisms/header/RightSlot.vue2.js +19 -23
  14. package/dist/components/organisms/onboarding/TextBlockOnboarding.vue.js +5 -5
  15. package/dist/components/organisms/onboarding/TextBlockOnboarding.vue2.js +28 -40
  16. package/dist/composables/useCustomInterfaceAppearance.js +18 -22
  17. package/dist/composables/useSave.d.ts +1 -2
  18. package/dist/composables/useSave.js +8 -9
  19. package/dist/composables/useStripo.js +25 -27
  20. package/dist/composables/useToaster.js +17 -17
  21. package/dist/guido.css +1 -1
  22. package/dist/static/styles/components/alert-message.css.js +2 -32
  23. package/dist/static/styles/components/button.css.js +2 -32
  24. package/dist/static/styles/components/wide-panel.css.js +1 -5
  25. package/dist/static/styles/customEditorStyle.css.js +0 -6
  26. package/dist/static/styles/variables.css.js +0 -10
  27. package/dist/stores/dynamic-content.d.ts +0 -12
  28. package/dist/stores/dynamic-content.js +6 -7
  29. package/dist/utils/genericUtil.js +6 -9
  30. package/package.json +1 -1
  31. package/dist/static/styles/components/notification.css.js +0 -55
  32. package/dist/static/styles/components/popup.css.js +0 -68
package/README.md CHANGED
@@ -125,11 +125,6 @@ export default {
125
125
  // ⚠️ It's mandatory. There is no way to understand if user closes the modal without selection.
126
126
  handleDynamicContentClose() {
127
127
  this.$refs.guidoEditor?.dynamicContent.close();
128
- },
129
-
130
- // If you need to trigger save manually like leave modal cases, you can use this method.
131
- save () {
132
- this.$refs.guidoEditor?.saveSilent();
133
128
  }
134
129
  }
135
130
  };
@@ -160,13 +155,11 @@ export default {
160
155
  | `save:start` | - | Fired when the save process begins |
161
156
  | `save:complete` | `Omit<Template, 'forceRecreate'>` | Fired when template is successfully saved |
162
157
  | `on-change` | void | It Fires once for managing leave modal etc. |
163
- | `ready` | void | Fired when the editor is ready and template is loaded |
164
158
 
165
159
  ### Guido Exposed Methods
166
160
  ```typescript
167
161
  dynamicContent.insert(DynamicContent);
168
162
  dynamicContent.close();
169
- saveSilent();
170
163
  ```
171
164
 
172
165
  ### Guido Interfaces
@@ -22,10 +22,6 @@ export type DynamicContent = {
22
22
  value: string;
23
23
  text: string;
24
24
  fallback?: string;
25
- format?: {
26
- key: string;
27
- value: string;
28
- };
29
25
  };
30
26
  export interface EmailHeader {
31
27
  senderName: string;
@@ -18,14 +18,12 @@ declare const _default: import("vue").DefineComponent<__VLS_TypePropsToOption<__
18
18
  close: () => void;
19
19
  };
20
20
  hasChanges: import("vue").ComputedRef<boolean>;
21
- saveSilent: () => Promise<SavedTemplateDetails | undefined> | undefined;
22
21
  }, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {
23
22
  "dynamic-content:open": (detail: DynamicContent | null) => void;
24
23
  back: () => void;
25
24
  "save:start": () => void;
26
25
  "save:complete": (data: Omit<SavedTemplateDetails, "forceRecreate">) => void;
27
- "on-change": (hasChanges: boolean) => void;
28
- ready: () => void;
26
+ "on-change": () => void;
29
27
  }, string, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<__VLS_Props>>>, {}>;
30
28
  export default _default;
31
29
  type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
@@ -1,16 +1,16 @@
1
1
  import a from "./Guido.vue2.js";
2
2
  /* empty css */
3
3
  import i from "../_virtual/_plugin-vue2_normalizer.js";
4
- var s = function() {
4
+ var t = function() {
5
5
  var o = this, r = o._self._c, e = o._self._setupProxy;
6
- return r("div", { staticClass: "guido-editor__wrapper", class: { "guido-editor__no-header": e.noHeader } }, [r(e.HeaderWrapper, { ref: "headerWrapperRef" }), e.editorStore.isPreviewModeOpen ? r(e.PreviewContainer) : o._e(), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.previewStore.isLoaded, expression: "!previewStore.isLoaded" }], staticClass: "guido-editor__container", class: { "guido-editor__no-header": e.noHeader }, attrs: { id: "guido-editor" } }), r(e.Toaster), r(e.SaveAsTemplateDrawer), !e.isTestPartner() && !e.isDevMode ? r(e.OnboardingWrapper) : o._e(), r(e.LoadingWrapper)], 1);
7
- }, t = [], d = /* @__PURE__ */ i(
6
+ return r("div", { staticClass: "guido-editor__wrapper", class: { "guido-editor__no-header": e.noHeader } }, [r(e.HeaderWrapper), e.editorStore.isPreviewModeOpen ? r(e.PreviewContainer) : o._e(), r("div", { directives: [{ name: "show", rawName: "v-show", value: !e.previewStore.isLoaded, expression: "!previewStore.isLoaded" }], staticClass: "guido-editor__container", class: { "guido-editor__no-header": e.noHeader }, attrs: { id: "guido-editor" } }), r(e.Toaster), r(e.SaveAsTemplateDrawer), e.isTestPartner() ? o._e() : r(e.OnboardingWrapper), r(e.LoadingWrapper)], 1);
7
+ }, s = [], d = /* @__PURE__ */ i(
8
8
  a,
9
- s,
10
9
  t,
10
+ s,
11
11
  !1,
12
12
  null,
13
- "cebb8ab0"
13
+ "39783038"
14
14
  );
15
15
  const v = d.exports;
16
16
  export {
@@ -1,18 +1,18 @@
1
- import { defineComponent as H, defineAsyncComponent as G, ref as M, computed as c, watch as R, onMounted as U, onUnmounted as x } from "vue";
2
- import { provideGuidoActions as F } from "../composables/useGuidoActions.js";
3
- import { usePartner as z } from "../composables/usePartner.js";
4
- import { useStripo as B } from "../composables/useStripo.js";
5
- import { DefaultUsername as K, DefaultMessageType as O, DefaultGuidoConfig as j } from "../enums/defaults.js";
6
- import q from "./organisms/base/Toaster.vue.js";
7
- import J from "./organisms/header/HeaderWrapper.vue.js";
8
- import Q from "./organisms/LoadingWrapper.vue.js";
9
- import V from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
10
- import { useStripoApi as X } from "../services/stripoApi.js";
11
- import { useDynamicContentStore as Y } from "../stores/dynamic-content.js";
12
- import { useEditorStore as Z } from "../stores/editor.js";
13
- import { usePreviewStore as $ } from "../stores/preview.js";
14
- import ee from "../node_modules/lodash-es/merge.js";
15
- const fe = /* @__PURE__ */ H({
1
+ import { defineComponent as A, defineAsyncComponent as b, computed as T, watch as W, onMounted as H, onUnmounted as N } from "vue";
2
+ import { provideGuidoActions as U } from "../composables/useGuidoActions.js";
3
+ import { usePartner as x } from "../composables/usePartner.js";
4
+ import { useStripo as M } from "../composables/useStripo.js";
5
+ import { DefaultUsername as z, DefaultMessageType as B, DefaultGuidoConfig as F } from "../enums/defaults.js";
6
+ import K from "./organisms/base/Toaster.vue.js";
7
+ import O from "./organisms/header/HeaderWrapper.vue.js";
8
+ import R from "./organisms/LoadingWrapper.vue.js";
9
+ import j from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
10
+ import { useStripoApi as q } from "../services/stripoApi.js";
11
+ import { useDynamicContentStore as J } from "../stores/dynamic-content.js";
12
+ import { useEditorStore as Q } from "../stores/editor.js";
13
+ import { usePreviewStore as V } from "../stores/preview.js";
14
+ import X from "../node_modules/lodash-es/merge.js";
15
+ const le = /* @__PURE__ */ A({
16
16
  __name: "Guido",
17
17
  props: {
18
18
  templateId: null,
@@ -26,96 +26,85 @@ const fe = /* @__PURE__ */ H({
26
26
  preselectedDynamicContentList: null,
27
27
  guidoConfig: null
28
28
  },
29
- emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change", "ready"],
30
- setup(P, { expose: I, emit: o }) {
31
- const n = P, L = G(
29
+ emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change"],
30
+ setup(E, { expose: G, emit: t }) {
31
+ const o = E, P = b(
32
32
  () => import("./organisms/email-preview/PreviewContainer.vue.js")
33
- ), _ = G(
33
+ ), I = b(
34
34
  () => import("./organisms/onboarding/OnboardingWrapper.vue.js")
35
- ), d = M(), r = Y(), m = Z(), W = $(), t = c(() => m.hasChanges), a = n.preselectedDynamicContentList || [], { getPartnerName: l, getProductType: u, isTestPartner: k } = z(), A = c(() => !1), p = () => {
36
- var e;
37
- return (e = d.value) == null ? void 0 : e.handleSave(!0);
38
- }, {
39
- templateId: g,
40
- userId: f,
41
- guidoConfig: y,
42
- html: v = "",
43
- css: C = "",
44
- partnerName: s = l(),
45
- productType: i = u(),
46
- messageType: h = O,
47
- username: w = K
48
- } = n;
49
- window.GuidoConfig = ee(j, y), window.GuidoConfig.partner = {
50
- partnerName: s,
51
- productType: i,
52
- messageType: h
35
+ ), n = J(), c = Q(), L = V(), r = T(() => c.hasChanges), a = o.preselectedDynamicContentList || [], { getPartnerName: m, getProductType: d, isTestPartner: _ } = x(), {
36
+ templateId: l,
37
+ userId: p,
38
+ guidoConfig: u,
39
+ html: g = "",
40
+ css: f = "",
41
+ partnerName: i = m(),
42
+ productType: s = d(),
43
+ messageType: y = B,
44
+ username: C = z
45
+ } = o;
46
+ window.GuidoConfig = X(F, u), window.GuidoConfig.partner = {
47
+ partnerName: i,
48
+ productType: s,
49
+ messageType: y
53
50
  };
54
- const { initPlugin: S } = B({
55
- emailId: g,
56
- userId: f,
57
- username: w,
58
- partnerName: s,
59
- productType: i,
60
- preselectedDynamicContentList: a,
61
- onReady: () => {
62
- console.debug("guido:ready"), o("ready");
63
- }
64
- }), { getDefaultTemplate: D } = X(), N = c(() => {
51
+ const { initPlugin: v } = M({
52
+ emailId: l,
53
+ userId: p,
54
+ username: C,
55
+ partnerName: i,
56
+ productType: s,
57
+ preselectedDynamicContentList: a
58
+ }), { getDefaultTemplate: w } = q(), k = T(() => {
65
59
  var e;
66
60
  return !((e = window.GuidoConfig) != null && e.useHeader);
67
61
  });
68
- F({
62
+ U({
69
63
  onBack: () => {
70
- console.debug("guido:back"), o("back");
64
+ console.debug("guido:back"), t("back");
71
65
  },
72
66
  onSaveStart: () => {
73
- console.debug("guido:save:start"), o("save:start");
67
+ console.debug("guido:save:start"), t("save:start");
74
68
  },
75
69
  onSaveComplete: (e) => {
76
- console.debug("guido:save:complete", e), o("save:complete", e);
70
+ console.debug("guido:save:complete", e), t("save:complete", e);
77
71
  }
78
72
  });
79
- const b = (e) => {
80
- console.debug("dynamic-content:close", e), r.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
81
- }, T = () => {
73
+ const h = (e) => {
74
+ console.debug("dynamic-content:close", e), n.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
75
+ }, D = () => {
82
76
  console.debug("dynamic-content:close", "Without Data"), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: { text: "", value: "" } }));
83
77
  };
84
- return R(() => t.value, () => {
85
- o("on-change", t.value);
86
- }), U(async () => {
78
+ return W(() => r.value, () => {
79
+ t("on-change");
80
+ }), H(async () => {
87
81
  console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow");
88
82
  try {
89
83
  let e = {
90
- html: v,
91
- css: C,
84
+ html: g,
85
+ css: f,
92
86
  forceRecreate: !0
93
87
  // TODO: It should be false for old templates. We will communicate with Stripo
94
88
  };
95
- e.html || (e = await D()), await S(e), r.selectedDynamicContentList = a;
89
+ e.html || (e = await w()), await v(e), n.selectedDynamicContentList = a;
96
90
  } catch (e) {
97
91
  console.error("Failed to initialize Stripo editor:", e);
98
92
  }
99
93
  document.addEventListener("dynamic-content:open", (e) => {
100
- const E = e;
101
- console.debug("dynamic-content:open", E.detail), o("dynamic-content:open", E.detail);
94
+ const S = e;
95
+ console.debug("dynamic-content:open", S.detail), t("dynamic-content:open", S.detail);
102
96
  });
103
- }), x(() => {
104
- try {
105
- window.UIEditor.removeEditor();
106
- } catch {
107
- console.debug("Failed to remove Stripo editor: No editor found");
108
- }
109
- }), I({
97
+ }), N(() => {
98
+ window.UIEditor.removeEditor();
99
+ }), G({
110
100
  dynamicContent: {
111
- insert: b,
112
- close: T
101
+ insert: h,
102
+ close: D
113
103
  },
114
- hasChanges: t,
115
- saveSilent: p
116
- }), { __sfc: !0, PreviewContainer: L, OnboardingWrapper: _, headerWrapperRef: d, dynamicContentStore: r, props: n, editorStore: m, previewStore: W, hasChanges: t, preselectedDynamicContentList: a, getPartnerName: l, getProductType: u, isTestPartner: k, isDevMode: A, saveSilent: p, templateId: g, userId: f, guidoConfig: y, html: v, css: C, partnerName: s, productType: i, messageType: h, username: w, emit: o, initPlugin: S, getDefaultTemplate: D, noHeader: N, insertDynamicContent: b, closeDynamicContent: T, Toaster: q, HeaderWrapper: J, LoadingWrapper: Q, SaveAsTemplateDrawer: V };
104
+ hasChanges: r
105
+ }), { __sfc: !0, PreviewContainer: P, OnboardingWrapper: I, dynamicContentStore: n, props: o, editorStore: c, previewStore: L, hasChanges: r, preselectedDynamicContentList: a, getPartnerName: m, getProductType: d, isTestPartner: _, templateId: l, userId: p, guidoConfig: u, html: g, css: f, partnerName: i, productType: s, messageType: y, username: C, emit: t, initPlugin: v, getDefaultTemplate: w, noHeader: k, insertDynamicContent: h, closeDynamicContent: D, Toaster: K, HeaderWrapper: O, LoadingWrapper: R, SaveAsTemplateDrawer: j };
117
106
  }
118
107
  });
119
108
  export {
120
- fe as default
109
+ le as default
121
110
  };
@@ -10,7 +10,7 @@ var s = function() {
10
10
  n,
11
11
  !1,
12
12
  null,
13
- "dced5582"
13
+ "2d4cd446"
14
14
  );
15
15
  const l = _.exports;
16
16
  export {
@@ -1,9 +1,8 @@
1
1
  import o from "./AmpToggle.vue2.js";
2
- /* empty css */
3
2
  import n from "../../../../_virtual/_plugin-vue2_normalizer.js";
4
3
  var s = function() {
5
4
  var r = this, t = r._self._c, e = r._self._setupProxy;
6
- return t("div", [t("div", { staticClass: "d-f a-i-c ml-3" }, [t(e.InSegments, { attrs: { id: "guido__amp-toggle", "segment-list": e.segmentList, selected: e.previewStore.emailFormat }, on: { click: e.handleFormatChange } }), e.previewStore.showAMPErrorButton ? t(e.InButtonV2, { staticClass: "ml-2 d-f a-i-c b-c-11 b-c-h-11 t-c-4 t-c-h-4 i-c-4 bor-w-1 bor-s-s bor-c-11 bor-r-2", attrs: { id: "guido__amp-error-button", "left-icon": "line-error-box", type: "danger", "label-text-status": !1 }, on: { click: function(l) {
5
+ return t("div", [t("div", { staticClass: "d-f a-i-c ml-3" }, [t(e.InSegments, { attrs: { id: "guido__amp-toggle", "segment-list": e.segmentList, selected: e.previewStore.emailFormat }, on: { click: e.handleFormatChange } }), e.previewStore.showAMPErrorButton ? t(e.InButtonV2, { staticClass: "ml-2 d-f a-i-c b-c-11 b-c-h-11 t-c-4 t-c-h-4 i-c-4 bor-w-1 bor-s-s bor-c-11 bor-r-2", attrs: { id: "guido__amp-error-button", "left-icon": "line-error-box", type: "danger", "label-text-status": !1 }, on: { click: function(c) {
7
6
  return e.previewStore.openErrorModal();
8
7
  } } }) : r._e()], 1)]);
9
8
  }, a = [], i = /* @__PURE__ */ n(
@@ -12,7 +11,7 @@ var s = function() {
12
11
  a,
13
12
  !1,
14
13
  null,
15
- "b5997368"
14
+ null
16
15
  );
17
16
  const d = i.exports;
18
17
  export {
@@ -1,4 +1,2 @@
1
- declare const _default: import("vue").DefineComponent<{}, {
2
- handleSave: (isSilent: boolean) => Promise<import("../../../@types/stripo.js").SavedTemplateDetails | undefined> | undefined;
3
- }, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
1
+ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
4
2
  export default _default;
@@ -1,17 +1,17 @@
1
- import o from "./HeaderWrapper.vue2.js";
1
+ import t from "./HeaderWrapper.vue2.js";
2
2
  import s from "../../../_virtual/_plugin-vue2_normalizer.js";
3
3
  var n = function() {
4
- var t = this, r = t._self._c, e = t._self._setupProxy;
5
- return r(e.InContainer, { attrs: { border: "bor-w-0 bor-b-w-1 bor-s-s bor-c-6", "border-radius": "bor-r-0" } }, [r("div", { staticClass: "w-1 d-f a-i-c j-c-s-b p-3" }, [r(e.LeftSlot), r(e.MiddleSlot), r(e.RightSlot, { ref: "rightSlotRef" })], 1)]);
4
+ var o = this, r = o._self._c, e = o._self._setupProxy;
5
+ return r(e.InContainer, { attrs: { border: "bor-w-0 bor-b-w-1 bor-s-s bor-c-6", "border-radius": "bor-r-0" } }, [r("div", { staticClass: "w-1 d-f a-i-c j-c-s-b p-3" }, [r(e.LeftSlot), r(e.MiddleSlot), r(e.RightSlot)], 1)]);
6
6
  }, a = [], _ = /* @__PURE__ */ s(
7
- o,
7
+ t,
8
8
  n,
9
9
  a,
10
10
  !1,
11
11
  null,
12
12
  null
13
13
  );
14
- const c = _.exports;
14
+ const d = _.exports;
15
15
  export {
16
- c as default
16
+ d as default
17
17
  };
@@ -1,20 +1,14 @@
1
- import { defineComponent as n, ref as m } from "vue";
2
- import { InContainer as a } from "@useinsider/design-system-vue";
3
- import f from "./LeftSlot.vue.js";
4
- import p from "./MiddleSlot.vue.js";
5
- import i from "./RightSlot.vue.js";
6
- const c = /* @__PURE__ */ n({
1
+ import { defineComponent as o } from "vue";
2
+ import { InContainer as r } from "@useinsider/design-system-vue";
3
+ import t from "./LeftSlot.vue.js";
4
+ import e from "./MiddleSlot.vue.js";
5
+ import m from "./RightSlot.vue.js";
6
+ const s = /* @__PURE__ */ o({
7
7
  __name: "HeaderWrapper",
8
- setup(l, { expose: r }) {
9
- const e = m(null);
10
- return r({
11
- handleSave: (t) => {
12
- var o;
13
- return (o = e.value) == null ? void 0 : o.handleSave(t);
14
- }
15
- }), { __sfc: !0, rightSlotRef: e, InContainer: a, LeftSlot: f, MiddleSlot: p, RightSlot: i };
8
+ setup(p) {
9
+ return { __sfc: !0, InContainer: r, LeftSlot: t, MiddleSlot: e, RightSlot: m };
16
10
  }
17
11
  });
18
12
  export {
19
- c as default
13
+ s as default
20
14
  };
@@ -1,4 +1,2 @@
1
- declare const _default: import("vue").DefineComponent<{}, {
2
- handleSave: (isSilent: boolean) => Promise<import("../../../@types/stripo").SavedTemplateDetails | undefined>;
3
- }, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
1
+ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {}, string, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
4
2
  export default _default;
@@ -3,9 +3,7 @@ import a from "../../../_virtual/_plugin-vue2_normalizer.js";
3
3
  var l = function() {
4
4
  var s, i;
5
5
  var o = this, e = o._self._c, t = o._self._setupProxy;
6
- return e("div", { staticClass: "d-f" }, [(s = t.config.features) != null && s.versionHistory ? 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 = t.config.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(), 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"), "tooltip-text": t.trans("newsletter.test-email") } }), 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(p) {
7
- return t.handleSave(!1);
8
- } } })], 1);
6
+ return e("div", { staticClass: "d-f" }, [(s = t.config.features) != null && s.versionHistory ? 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 = t.config.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(), 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"), "tooltip-text": t.trans("newsletter.test-email") } }), 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: t.handleSave } })], 1);
9
7
  }, r = [], d = /* @__PURE__ */ a(
10
8
  n,
11
9
  l,
@@ -14,7 +12,7 @@ var l = function() {
14
12
  null,
15
13
  null
16
14
  );
17
- const g = d.exports;
15
+ const c = d.exports;
18
16
  export {
19
- g as default
17
+ c as default
20
18
  };
@@ -1,35 +1,31 @@
1
- import { defineComponent as g, ref as l, computed as H } from "vue";
2
- import { useConfig as _ } from "../../../composables/useConfig.js";
3
- import { useExport as h } from "../../../composables/useExport.js";
4
- import { useSave as V } from "../../../composables/useSave.js";
5
- import { useTranslations as x } from "../../../composables/useTranslations.js";
6
- import { useVersionHistoryApi as w } from "../../../composables/useVersionHistoryApi.js";
7
- import { useEditorStore as T } from "../../../stores/editor.js";
8
- import { getTooltipOptions as E } from "../../../utils/tooltipUtils.js";
9
- import { InButtonV2 as O } from "@useinsider/design-system-vue";
10
- const z = /* @__PURE__ */ g({
1
+ import { defineComponent as v, ref as p, computed as d } from "vue";
2
+ import { useConfig as y } from "../../../composables/useConfig.js";
3
+ import { useExport as S } from "../../../composables/useExport.js";
4
+ import { useSave as g } from "../../../composables/useSave.js";
5
+ import { useTranslations as h } from "../../../composables/useTranslations.js";
6
+ import { useVersionHistoryApi as H } from "../../../composables/useVersionHistoryApi.js";
7
+ import { useEditorStore as _ } from "../../../stores/editor.js";
8
+ import { getTooltipOptions as V } from "../../../utils/tooltipUtils.js";
9
+ import { InButtonV2 as x } from "@useinsider/design-system-vue";
10
+ const j = /* @__PURE__ */ v({
11
11
  __name: "RightSlot",
12
- setup(A, { expose: m }) {
13
- const { config: u } = _(), { exportHtml: r } = h(), { save: n } = V(), { openVersionHistory: i, closeVersionHistory: a } = w(), o = T(), t = x(), e = l(!1), s = l(!1), c = () => {
12
+ setup(w) {
13
+ const { config: l } = y(), { exportHtml: r } = S(), { save: n } = g(), { openVersionHistory: i, closeVersionHistory: a } = H(), o = _(), t = h(), e = p(!1), s = p(!1), m = () => {
14
14
  if (o.isVersionHistoryOpen) {
15
15
  a();
16
16
  return;
17
17
  }
18
18
  i();
19
- }, f = async () => {
19
+ }, u = async () => {
20
20
  e.value = !0, await r(), e.value = !1;
21
- }, v = () => {
21
+ }, c = () => {
22
22
  o.isSaveAsTemplateDrawerOpen = !0;
23
- }, d = H(() => o.isVersionHistoryOpen ? t("newsletter.close-version-history") : t("newsletter.version-history")), p = async (y) => {
24
- s.value = !0, o.loadingStatus = !0;
25
- const S = await n(y);
26
- return s.value = !1, o.loadingStatus = !1, S;
27
- };
28
- return m({
29
- handleSave: p
30
- }), { __sfc: !0, config: u, exportHtml: r, save: n, openVersionHistory: i, closeVersionHistory: a, editorStore: o, trans: t, isExporting: e, isSaving: s, handleVersionHistory: c, handleExport: f, handleSaveAs: v, versionHistoryTooltipText: d, handleSave: p, getTooltipOptions: E, InButtonV2: O };
23
+ }, f = d(() => o.isVersionHistoryOpen ? t("newsletter.close-version-history") : t("newsletter.version-history"));
24
+ return { __sfc: !0, config: l, exportHtml: r, save: n, openVersionHistory: i, closeVersionHistory: a, editorStore: o, trans: t, isExporting: e, isSaving: s, handleVersionHistory: m, handleExport: u, handleSaveAs: c, versionHistoryTooltipText: f, handleSave: async () => {
25
+ s.value = !0, o.loadingStatus = !0, await n(), s.value = !1, o.loadingStatus = !1;
26
+ }, getTooltipOptions: V, InButtonV2: x };
31
27
  }
32
28
  });
33
29
  export {
34
- z as default
30
+ j as default
35
31
  };
@@ -1,19 +1,19 @@
1
- import l from "./TextBlockOnboarding.vue2.js";
1
+ import c from "./TextBlockOnboarding.vue2.js";
2
2
  /* empty css */
3
3
  import d from "../../../_virtual/_plugin-vue2_normalizer.js";
4
4
  var g = function() {
5
5
  var e, n, r, i, a, s;
6
- var t = this, c = t._self._c, o = t._self._setupProxy;
7
- return o.isVisible ? c(o.InOnboard, { key: "guido__text-block-onboard", staticClass: "w-21-s p-a z-11", class: (e = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : e.classes, attrs: { id: "guido__text-block-onboard", "is-multiple-page": "", visible: "", "image-source": "", title: "", "bottom-position": (n = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : n.bottom, "left-position": (r = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : r.left, "pages-config": o.onboardingStore.onboardings.textBlockOnboarding.config, "pointer-position": (i = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : i.position, "right-position": (a = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : a.right, "top-position": (s = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : s.top }, on: { backButtonClick: o.handleBack, close: function(u) {
6
+ var t = this, l = t._self._c, o = t._self._setupProxy;
7
+ return o.isVisible ? l(o.InOnboard, { key: "guido__text-block-onboard", staticClass: "w-21-s p-a z-11", class: (e = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : e.classes, attrs: { id: "guido__text-block-onboard", "is-multiple-page": "", visible: "", "image-source": "", title: "", "bottom-position": (n = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : n.bottom, "left-position": (r = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : r.left, "pages-config": o.onboardingStore.onboardings.textBlockOnboarding.config, "pointer-position": (i = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : i.position, "right-position": (a = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : a.right, "top-position": (s = o.onboardingStore.getTextBlockCurrentCard) == null ? void 0 : s.top }, on: { backButtonClick: o.handleBack, close: function(u) {
8
8
  return o.onboardingStore.close("textBlockOnboarding");
9
9
  }, nextButtonClick: o.handleNext } }) : t._e();
10
10
  }, b = [], p = /* @__PURE__ */ d(
11
- l,
11
+ c,
12
12
  g,
13
13
  b,
14
14
  !1,
15
15
  null,
16
- "a408dcea"
16
+ "7817bb55"
17
17
  );
18
18
  const f = p.exports;
19
19
  export {
@@ -1,35 +1,23 @@
1
- import { defineComponent as u, computed as a, watch as b } from "vue";
2
- import { useTranslations as m } from "../../../composables/useTranslations.js";
3
- import { useOnboardingStore as k } from "../../../stores/onboarding.js";
4
- import { InOnboard as B } from "@useinsider/design-system-vue";
5
- const y = /* @__PURE__ */ u({
1
+ import { defineComponent as s, computed as r, watch as l } from "vue";
2
+ import { useTranslations as x } from "../../../composables/useTranslations.js";
3
+ import { useOnboardingStore as g } from "../../../stores/onboarding.js";
4
+ import { InOnboard as b } from "@useinsider/design-system-vue";
5
+ const C = /* @__PURE__ */ s({
6
6
  __name: "TextBlockOnboarding",
7
- setup(h) {
8
- const i = m(), o = k(), e = a(() => {
9
- const n = window.innerHeight - 128, r = Math.max(90, n * 0.15), s = Math.max(490, n * 0.71), d = 200, g = 40;
10
- return {
11
- settings: {
12
- top: `${r}px`,
13
- position: r + d + g > n ? "Right Bottom" : "Right Top"
14
- },
15
- dynamic: {
16
- top: `${s}px`,
17
- position: s + d + g > n ? "Right Bottom" : "Right Top"
18
- }
19
- };
20
- }), c = a(() => [
7
+ setup(p) {
8
+ const n = x(), o = g(), i = r(() => [
21
9
  {
22
10
  classes: "guido-text-block-onboarding-settings",
23
11
  right: "450px",
24
- top: e.value.settings.top,
25
- position: e.value.settings.position,
26
- title: i("email-editor.onboarding-text-block-title"),
27
- description: i("email-editor.onboarding-text-block-description"),
12
+ top: "90px",
13
+ position: "Right Top",
14
+ title: n("email-editor.onboarding-text-block-title"),
15
+ description: n("email-editor.onboarding-text-block-description"),
28
16
  imageSource: "",
29
17
  backButtonClick: () => {
30
18
  },
31
19
  nextButtonType: "text",
32
- nextButtonText: i("products.next"),
20
+ nextButtonText: n("products.next"),
33
21
  nextButtonClick: () => {
34
22
  o.next("textBlockOnboarding");
35
23
  }
@@ -37,38 +25,38 @@ const y = /* @__PURE__ */ u({
37
25
  {
38
26
  classes: "guido-text-block-onboarding-dynamic",
39
27
  right: "450px",
40
- top: e.value.dynamic.top,
41
- position: e.value.dynamic.position,
42
- title: i("email-editor.onboarding-dynamic-content-title"),
43
- description: i("email-editor.onboarding-dynamic-content-description"),
28
+ top: "594px",
29
+ position: "Right Top",
30
+ title: n("email-editor.onboarding-dynamic-content-title"),
31
+ description: n("email-editor.onboarding-dynamic-content-description"),
44
32
  imageSource: "",
45
33
  backButtonType: "text",
46
- backButtonText: i("ds-steps.back"),
34
+ backButtonText: n("ds-steps.back"),
47
35
  backButtonClick: () => {
48
36
  o.previous("textBlockOnboarding");
49
37
  },
50
38
  nextButtonType: "text",
51
- nextButtonText: i("action-builder.ok"),
39
+ nextButtonText: n("action-builder.ok"),
52
40
  nextButtonClick: () => {
53
41
  o.close("textBlockOnboarding");
54
42
  }
55
43
  }
56
- ]), l = a(() => o.onboardings.textBlockOnboarding.config.length > 0 && o.onboardings.textBlockOnboarding.isActive), p = () => {
57
- var t, n;
58
- (n = (t = o.getTextBlockCurrentCard) == null ? void 0 : t.nextButtonClick) == null || n.call(t);
59
- }, x = () => {
60
- var t, n;
61
- (n = (t = o.getTextBlockCurrentCard) == null ? void 0 : t.backButtonClick) == null || n.call(t);
44
+ ]), c = r(() => o.onboardings.textBlockOnboarding.config.length > 0 && o.onboardings.textBlockOnboarding.isActive), a = () => {
45
+ var t, e;
46
+ (e = (t = o.getTextBlockCurrentCard) == null ? void 0 : t.nextButtonClick) == null || e.call(t);
47
+ }, d = () => {
48
+ var t, e;
49
+ (e = (t = o.getTextBlockCurrentCard) == null ? void 0 : t.backButtonClick) == null || e.call(t);
62
50
  };
63
- return b(
51
+ return l(
64
52
  () => o.isActive("textBlockOnboarding"),
65
53
  (t) => {
66
- t && o.setConfig("textBlockOnboarding", c.value);
54
+ t && o.setConfig("textBlockOnboarding", i.value);
67
55
  },
68
56
  { immediate: !0 }
69
- ), { __sfc: !0, trans: i, onboardingStore: o, dynamicPosition: e, onboardingCardsConfig: c, isVisible: l, handleNext: p, handleBack: x, InOnboard: B };
57
+ ), { __sfc: !0, trans: n, onboardingStore: o, onboardingCardsConfig: i, isVisible: c, handleNext: a, handleBack: d, InOnboard: b };
70
58
  }
71
59
  });
72
60
  export {
73
- y as default
61
+ C as default
74
62
  };
@@ -1,34 +1,32 @@
1
1
  import S from "../static/styles/base.css.js";
2
- import m from "../static/styles/components/alert-message.css.js";
3
- import e from "../static/styles/components/amp-block.css.js";
2
+ import e from "../static/styles/components/alert-message.css.js";
3
+ import m from "../static/styles/components/amp-block.css.js";
4
4
  import i from "../static/styles/components/base-input.css.js";
5
5
  import p from "../static/styles/components/button-group.css.js";
6
6
  import n from "../static/styles/components/button.css.js";
7
- import C from "../static/styles/components/combobox.css.js";
8
- import s from "../static/styles/components/counter.css.js";
7
+ import s from "../static/styles/components/combobox.css.js";
8
+ import C from "../static/styles/components/counter.css.js";
9
9
  import f from "../static/styles/components/dropdown-menu.css.js";
10
10
  import a from "../static/styles/components/loader.css.js";
11
11
  import u from "../static/styles/components/narrow-panel.css.js";
12
- import c from "../static/styles/components/notification.css.js";
13
- import d from "../static/styles/components/popup.css.js";
14
- import l from "../static/styles/components/switcher.css.js";
15
- import h from "../static/styles/components/tabs.css.js";
16
- import w from "../static/styles/components/tools.css.js";
17
- import y from "../static/styles/components/version-history.css.js";
18
- import B from "../static/styles/components/wide-panel.css.js";
19
- import b from "../static/styles/variables.css.js";
20
- const A = [
21
- b,
12
+ import c from "../static/styles/components/switcher.css.js";
13
+ import d from "../static/styles/components/tabs.css.js";
14
+ import l from "../static/styles/components/tools.css.js";
15
+ import h from "../static/styles/components/version-history.css.js";
16
+ import w from "../static/styles/components/wide-panel.css.js";
17
+ import y from "../static/styles/variables.css.js";
18
+ const B = [
19
+ y,
22
20
  // Must be on top
23
21
  S,
24
22
  // Must be on top
25
- m,
26
23
  e,
24
+ m,
27
25
  i,
28
26
  p,
29
27
  n,
30
- C,
31
28
  s,
29
+ C,
32
30
  f,
33
31
  a,
34
32
  u,
@@ -36,14 +34,12 @@ const A = [
36
34
  d,
37
35
  l,
38
36
  h,
39
- w,
40
- y,
41
- B
37
+ w
42
38
  ].join(`
43
39
 
44
- `), F = () => ({ importCss: () => {
40
+ `), R = () => ({ importCss: () => {
45
41
  const o = new CSSStyleSheet();
46
- o.replaceSync(A);
42
+ o.replaceSync(B);
47
43
  const r = document.querySelector("ui-editor");
48
44
  if (!r)
49
45
  return;
@@ -51,5 +47,5 @@ const A = [
51
47
  t && (t.adoptedStyleSheets = [o]);
52
48
  } });
53
49
  export {
54
- F as useCustomInterfaceAppearance
50
+ R as useCustomInterfaceAppearance
55
51
  };
@@ -1,4 +1,3 @@
1
- import { SavedTemplateDetails } from '@@/Types/stripo';
2
1
  export declare const useSave: () => {
3
- save: (isSilent?: boolean) => Promise<SavedTemplateDetails | undefined>;
2
+ save: () => Promise<void>;
4
3
  };
@@ -1,15 +1,14 @@
1
- import { useSaveStart as i, useSaveComplete as l } from "./useGuidoActions.js";
1
+ import { useSaveStart as r, useSaveComplete as i } from "./useGuidoActions.js";
2
2
  import { useTemplatePreparation as m } from "../utils/templatePreparation.js";
3
- import { useHtmlValidator as n } from "./useHtmlValidator.js";
4
- const f = () => {
5
- const e = i(), a = l(), { validateHtml: s } = n();
6
- return { save: async (o = !1) => {
3
+ import { useHtmlValidator as l } from "./useHtmlValidator.js";
4
+ const d = () => {
5
+ const e = r(), a = i(), { validateHtml: s } = l();
6
+ return { save: async () => {
7
7
  e();
8
- const { prepareTemplateDetails: r } = m(), t = await r();
9
- if (await s(t.compiledHtml, [], !0))
10
- return o || a(t), t;
8
+ const { prepareTemplateDetails: o } = m(), t = await o();
9
+ await s(t.compiledHtml, [], !0) && a(t);
11
10
  } };
12
11
  };
13
12
  export {
14
- f as useSave
13
+ d as useSave
15
14
  };
@@ -1,22 +1,22 @@
1
- import { useActionsApi as f } from "./useActionsApi.js";
2
- import { useCustomInterfaceAppearance as S } from "./useCustomInterfaceAppearance.js";
3
- import { useStripoEventHandler as C } from "./useStripoEventHandler.js";
4
- import { useToaster as E } from "./useToaster.js";
1
+ import { useActionsApi as S } from "./useActionsApi.js";
2
+ import { useCustomInterfaceAppearance as f } from "./useCustomInterfaceAppearance.js";
3
+ import { useStripoEventHandler as E } from "./useStripoEventHandler.js";
4
+ import { useToaster as C } from "./useToaster.js";
5
5
  import { displayConditions as y } from "../enums/displayConditions.js";
6
6
  import h from "../extensions/DynamicContent/extension.js";
7
7
  import { useStripoApi as w } from "../services/stripoApi.js";
8
8
  import b from "../static/styles/customEditorStyle.css.js";
9
9
  import { useEditorStore as V } from "../stores/editor.js";
10
10
  import { dynamicContentToMergeTags as _ } from "../utils/genericUtil.js";
11
- const R = (s) => {
12
- const { handleError: d } = E(), { getToken: c, getCustomFonts: u } = w(), { handleEvent: l } = C(), p = (r, i = []) => {
13
- const e = V(), { html: o, css: a, forceRecreate: g } = r;
11
+ const x = (a) => {
12
+ const { handleError: d } = C(), { getToken: c, getCustomFonts: u } = w(), { handleEvent: l } = E(), p = (r, i = []) => {
13
+ const o = V(), { html: e, css: s, forceRecreate: g } = r;
14
14
  window.UIEditor.initEditor(
15
15
  document.querySelector("#guido-editor"),
16
16
  {
17
- metadata: s,
18
- html: o,
19
- css: a,
17
+ metadata: a,
18
+ html: e,
19
+ css: s,
20
20
  forceRecreate: g,
21
21
  locale: "en",
22
22
  undoButtonSelector: "#guido__undo-button",
@@ -41,7 +41,7 @@ const R = (s) => {
41
41
  },
42
42
  mergeTags: [
43
43
  {
44
- entries: _(s.preselectedDynamicContentList)
44
+ entries: _(a.preselectedDynamicContentList)
45
45
  }
46
46
  ],
47
47
  async onTokenRefreshRequest(t) {
@@ -54,43 +54,41 @@ const R = (s) => {
54
54
  },
55
55
  onTemplateLoaded() {
56
56
  try {
57
- const { importCss: t } = S(), { activateCustomViewStyles: n } = f();
58
- t(), n(), s.onReady(), e.isStripoInitialized = !0, e.loadingStatus = !1, setTimeout(() => {
59
- e.hasChanges = !1;
60
- }, 1e3);
57
+ const { importCss: t } = f(), { activateCustomViewStyles: n } = S();
58
+ t(), n(), o.isStripoInitialized = !0, o.loadingStatus = !1;
61
59
  } catch (t) {
62
60
  d(t, "Failed to load custom interface appearance");
63
61
  }
64
62
  },
65
63
  onCodeEditorVisibilityChanged(t) {
66
- e.isCodeEditorOpen = t;
64
+ o.isCodeEditorOpen = t;
67
65
  },
68
66
  onEditorVisualModeChanged(t) {
69
- e.editorVisualMode = t.toLowerCase();
67
+ o.editorVisualMode = t.toLowerCase();
70
68
  },
71
69
  onVersionHistoryVisibilityChanged(t) {
72
- e.isVersionHistoryOpen = t;
70
+ o.isVersionHistoryOpen = t;
73
71
  },
74
72
  onDataChanged() {
75
- e.hasChanges = !0;
73
+ o.hasChanges = !0;
76
74
  },
77
75
  onEvent: l,
78
76
  ignoreClickOutsideSelectors: ["#guido-dynamic-content-modal", ".in-on-board-wrapper"],
79
77
  extensions: [h]
80
78
  }
81
79
  );
82
- }, m = (r) => new Promise((i, e) => {
80
+ }, m = (r) => new Promise((i, o) => {
83
81
  if (document.getElementById("UiEditorScript")) {
84
82
  r(), i();
85
83
  return;
86
84
  }
87
- const o = document.createElement("script");
88
- o.id = "UiEditorScript", o.type = "module", o.src = "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js", o.onload = () => {
85
+ const e = document.createElement("script");
86
+ e.id = "UiEditorScript", e.type = "module", e.src = "https://plugins.stripo.email/resources/uieditor/latest/UIEditor.js", e.onload = () => {
89
87
  r(), i();
90
- }, o.onerror = () => {
91
- const a = new Error("Failed to load Stripo UIEditor script");
92
- e(a);
93
- }, document.body.appendChild(o);
88
+ }, e.onerror = () => {
89
+ const s = new Error("Failed to load Stripo UIEditor script");
90
+ o(s);
91
+ }, document.body.appendChild(e);
94
92
  });
95
93
  return { initPlugin: async (r) => {
96
94
  await m(async () => {
@@ -100,5 +98,5 @@ const R = (s) => {
100
98
  } };
101
99
  };
102
100
  export {
103
- R as useStripo
101
+ x as useStripo
104
102
  };
@@ -1,31 +1,31 @@
1
- import { ToasterTypeOptions as T } from "../enums/toaster.js";
2
- import { useToasterStore as u } from "../stores/toaster.js";
3
- import { watch as c } from "vue";
4
- const d = () => {
5
- const t = u();
6
- let o = null;
7
- const s = () => {
8
- o && (clearTimeout(o), o = null);
1
+ import { ToasterTypeOptions as u } from "../enums/toaster.js";
2
+ import { useToasterStore as T } from "../stores/toaster.js";
3
+ import { watch as c, onUnmounted as l } from "vue";
4
+ const p = () => {
5
+ const t = T();
6
+ let s = null;
7
+ const o = () => {
8
+ s && (clearTimeout(s), s = null);
9
9
  };
10
10
  function r(e = { message: "" }) {
11
- s(), t.hideToaster(), t.showToaster(e);
11
+ o(), t.hideToaster(), t.showToaster(e);
12
12
  }
13
- function i() {
14
- s(), t.hideToaster();
13
+ function n() {
14
+ o(), t.hideToaster();
15
15
  }
16
- function a(e, n) {
16
+ function i(e, a) {
17
17
  const m = e instanceof Error ? e.message : String(e);
18
- r({ type: T.Alert, message: `${n}: ${m}` });
18
+ r({ type: u.Alert, message: `${a}: ${m}` });
19
19
  }
20
20
  return c(
21
21
  () => t.shouldAutoHide,
22
22
  (e) => {
23
- s(), e && (o = setTimeout(() => {
24
- t.hideToaster(), s();
23
+ o(), e && (s = setTimeout(() => {
24
+ t.hideToaster(), o();
25
25
  }, 6e3));
26
26
  }
27
- ), { showToaster: r, hideToaster: i, handleError: a };
27
+ ), l(o), { showToaster: r, hideToaster: n, handleError: i };
28
28
  };
29
29
  export {
30
- d as useToaster
30
+ p as useToaster
31
31
  };
package/dist/guido.css CHANGED
@@ -1 +1 @@
1
- [data-v-a18ac2d3] .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-cebb8ab0],.guido-editor__container[data-v-cebb8ab0]{width:100%;height:calc(100vh - 128px)}.guido-editor__no-header[data-v-cebb8ab0]{height:calc(100vh - 75px)}.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}
1
+ [data-v-a18ac2d3] .in-button-v2__wrapper{line-height:0}.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-2d4cd446]{height:calc(100% - 75px);top:75px}.guido-editor__wrapper[data-v-39783038],.guido-editor__container[data-v-39783038]{width:100%;height:calc(100vh - 128px)}.guido-editor__no-header[data-v-39783038]{height:calc(100vh - 75px)}.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-7817bb55] .vueperslides__bullets{pointer-events:none!important}[data-v-7817bb55] .vueperslides__parallax-wrapper{height:110px!important}
@@ -1,4 +1,4 @@
1
- const r = `.alert-message-wrapper {
1
+ const n = `.alert-message-wrapper {
2
2
  box-shadow: none;
3
3
  border: 1px solid var(--guido-color-gray-300);
4
4
  color: var(--guido-color-gray-600);
@@ -16,36 +16,6 @@ const r = `.alert-message-wrapper {
16
16
  color: var(--guido-color-border-onpage-message-info);
17
17
  }
18
18
 
19
- .alert-message-wrapper.warn {
20
- background: var(--guido-color-background-onpage-message-warn);
21
- border-color: var(--guido-color-border-onpage-message-warn);
22
- color: inherit;
23
- }
24
-
25
- .alert-message-wrapper.warn ue-icon-component.icon {
26
- color: var(--guido-color-border-onpage-message-warn);
27
- }
28
-
29
- .alert-message-wrapper.success {
30
- background: var(--guido-color-background-onpage-message-success);
31
- border-color: var(--guido-color-border-onpage-message-success);
32
- color: inherit;
33
- }
34
-
35
- .alert-message-wrapper.success ue-icon-component.icon {
36
- color: var(--guido-color-border-onpage-message-success);
37
- }
38
-
39
- .alert-message-wrapper.error {
40
- background: var(--guido-color-background-onpage-message-error);
41
- border-color: var(--guido-color-border-onpage-message-error);
42
- color: inherit;
43
- }
44
-
45
- .alert-message-wrapper.error ue-icon-component.icon {
46
- color: var(--guido-color-border-onpage-message-error);
47
- }
48
-
49
19
  .alert-message-wrapper ue-button {
50
20
  padding: 0;
51
21
  }
@@ -65,5 +35,5 @@ const r = `.alert-message-wrapper {
65
35
  }
66
36
  `;
67
37
  export {
68
- r as default
38
+ n as default
69
39
  };
@@ -60,28 +60,8 @@ const o = `.control-shadow-wrapper:has(.button) {
60
60
  color: var(--guido-color-primary-500);
61
61
  }
62
62
 
63
- .primary > .button {
64
- border: none;
65
- background-color: var(--guido-color-neutral-200);
66
- color: var(--guido-color-neutral-800);
67
- }
68
-
69
- .primary > .button .icon-button {
70
- color: var(--guido-color-neutral-800);
71
- }
72
-
73
- .primary > .button:hover:not(:disabled,.disabled) {
74
- background-color: var(--guido-color-neutral-100);
75
- }
76
-
77
- .danger > .button {
78
- background-color: var(--guido-color-danger-500);
79
- color: var(--guido-color-white);
80
- border: none;
81
- }
82
-
83
- .danger > .button:hover:not(:disabled,.disabled) {
84
- background-color: var(--guido-color-danger-300);
63
+ .flat-white > .button:hover:not(:disabled,.disabled) {
64
+ color: var(--guido-color-primary-500);
85
65
  }
86
66
 
87
67
  ue-check-button.checked:not(.flat-white) input:checked + label {
@@ -120,16 +100,6 @@ ue-color {
120
100
  ue-color .base-input {
121
101
  width: 100%;
122
102
  }
123
-
124
- ue-select-text-input .select-text-input-toggle {
125
- top: 0;
126
- right: 0;
127
- }
128
-
129
- ue-select-text-input .select-text-input-toggle .button {
130
- justify-content: center;
131
- background-color: transparent !important;
132
- }
133
103
  `;
134
104
  export {
135
105
  o as default
@@ -2,10 +2,6 @@ const n = `ue-wide-panel {
2
2
  width: 425px;
3
3
  }
4
4
 
5
- ue-main-editor-container[panel-position=SETTINGS_BLOCKS] ue-wide-panel {
6
- right: calc(100% - calc(var(--ue-spacing-step, 5px) * 3) - 425px);
7
- }
8
-
9
5
  ue-main-tabs-panel-component .fixed-panel-header {
10
6
  display: none;
11
7
  }
@@ -21,7 +17,7 @@ ue-description a {
21
17
  }
22
18
 
23
19
  .stacked-panel {
24
- overflow: auto;
20
+ overflow: scroll;
25
21
  }
26
22
 
27
23
  .stacked-panel-title {
@@ -12,12 +12,6 @@ const n = `.esd-x,
12
12
  .ue-preview-control-wrapper ue-icon-component:not([disabled=true]):not(.stripo-static-icon):hover {
13
13
  background: none;
14
14
  }
15
-
16
- .ue-email-wrapper-rounded,
17
- .ue-email-wrapper-rounded-top {
18
- border-radius: 0;
19
- box-shadow: none;
20
- }
21
15
  `;
22
16
  export {
23
17
  n as default
@@ -12,20 +12,10 @@ const o = `:host {
12
12
  --guido-color-neutral-800: #222938;
13
13
  --guido-color-neutral-200: #DCDFE6;
14
14
  --guido-color-neutral-100: #EFF2F4;
15
- --guido-color-danger-300: #e84342;
16
15
  --guido-color-danger-500: #DC2A2A;
17
16
  --guido-box-shadow: 0 4px 12px 0 rgba(44,53,70,0.15);
18
17
  --guido-color-background-onpage-message-info: #D3EEF8;
19
18
  --guido-color-border-onpage-message-info: #258DDE;
20
- --guido-color-background-onpage-message-warn: #FCEFE5;
21
- --guido-color-border-onpage-message-warn: #D37400;
22
- --guido-color-background-onpage-message-success: #E9F9EB;
23
- --guido-color-border-onpage-message-success: #128745;
24
- --guido-color-background-onpage-message-error: #FCECEC;
25
- --guido-color-border-onpage-message-error: var(--guido-color-danger-500);
26
- --guido-color-background-toaster-success: #128745;
27
- --guido-color-background-toaster-error: var(--guido-color-danger-500);
28
- --guido-color-background-toaster-warn: #D37400;
29
19
  }
30
20
  `;
31
21
  export {
@@ -8,19 +8,11 @@ export declare const useDynamicContentStore: import("pinia").StoreDefinition<"dy
8
8
  value: string;
9
9
  text: string;
10
10
  fallback?: string | undefined;
11
- format?: {
12
- key: string;
13
- value: string;
14
- } | undefined;
15
11
  };
16
12
  selectedDynamicContentList: {
17
13
  value: string;
18
14
  text: string;
19
15
  fallback?: string | undefined;
20
- format?: {
21
- key: string;
22
- value: string;
23
- } | undefined;
24
16
  }[];
25
17
  } & import("pinia").PiniaCustomStateProperties<{
26
18
  selectedDynamicContent: DynamicContent;
@@ -29,10 +21,6 @@ export declare const useDynamicContentStore: import("pinia").StoreDefinition<"dy
29
21
  text: string;
30
22
  value: string;
31
23
  fallback: string | undefined;
32
- format: {
33
- key: string;
34
- value: string;
35
- } | undefined;
36
24
  }[];
37
25
  }, {
38
26
  setSelectedDynamicContent(dynamicContent: DynamicContent): void;
@@ -6,16 +6,15 @@ const s = a("dynamicContent", {
6
6
  selectedDynamicContentList: []
7
7
  }),
8
8
  actions: {
9
- setSelectedDynamicContent(t) {
10
- this.selectedDynamicContent = t, this.selectedDynamicContentList.push(t);
9
+ setSelectedDynamicContent(e) {
10
+ this.selectedDynamicContent = e, this.selectedDynamicContentList.push(e);
11
11
  }
12
12
  },
13
13
  getters: {
14
- getSelectedDynamicContentList: (t) => n(t.selectedDynamicContentList).map((e) => ({
15
- text: e.text,
16
- value: e.value,
17
- fallback: e.fallback,
18
- format: e.format
14
+ getSelectedDynamicContentList: (e) => n(e.selectedDynamicContentList).map((t) => ({
15
+ text: t.text,
16
+ value: t.value,
17
+ fallback: t.fallback
19
18
  })) || []
20
19
  }
21
20
  });
@@ -1,14 +1,11 @@
1
- const e = (l) => l.map((a) => a.format ? {
2
- label: `${a.text} | ${a.format.key}=${a.format.value}`,
3
- value: `{{${a.value}|${a.format.key}=${a.format.value}}}`
4
- } : {
1
+ const l = (e) => e.map((a) => ({
5
2
  label: a.fallback ? `${a.text} | ${a.fallback}` : a.text,
6
3
  value: a.fallback ? `{{${a.value}|${a.fallback}}}` : `{{${a.value}}}`
7
- }), r = () => {
8
- var l;
9
- return ((l = document.head.querySelector('meta[name="csrf-token"]')) == null ? void 0 : l.getAttribute("content")) ?? "";
4
+ })), t = () => {
5
+ var e;
6
+ return ((e = document.head.querySelector('meta[name="csrf-token"]')) == null ? void 0 : e.getAttribute("content")) ?? "";
10
7
  };
11
8
  export {
12
- e as dynamicContentToMergeTags,
13
- r as getCsrfToken
9
+ l as dynamicContentToMergeTags,
10
+ t as getCsrfToken
14
11
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useinsider/guido",
3
- "version": "1.0.2-beta.a06a05e",
3
+ "version": "1.0.2-beta.a71d19d",
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,55 +0,0 @@
1
- const n = `ue-notifications-container {
2
- left: 96px;
3
- margin: 0;
4
- bottom: 32px;
5
- top: unset;
6
- width: unset;
7
- }
8
-
9
- ue-notifications-container ue-message + ue-message {
10
- margin-bottom: 24px;
11
- }
12
-
13
- ue-notifications-container .alert-message-wrapper {
14
- box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.07);
15
- border: none;
16
- padding: 16px 24px;
17
- }
18
-
19
- ue-notifications-container .alert-message-wrapper .alert-message-main .alert-message-content {
20
- width: calc(100% - 64px);
21
- }
22
-
23
- ue-notifications-container .alert-message-wrapper .alert-message-main .alert-message-text {
24
- font-size: 15px;
25
- font-weight: 600;
26
- }
27
-
28
- ue-notifications-container .alert-message-text,
29
- ue-notifications-container .alert-message-wrapper ue-icon-component.icon,
30
- ue-notifications-container .alert-message-wrapper ue-icon-component.icon-button {
31
- color: var(--guido-color-white);
32
- }
33
-
34
- ue-notifications-container ue-message ue-button.close {
35
- margin: 0 0 0 16px;
36
- }
37
-
38
- ue-notifications-container .alert-message-wrapper.success {
39
- background: var(--guido-color-background-toaster-success);
40
- color: inherit;
41
- }
42
-
43
- ue-notifications-container .alert-message-wrapper.error {
44
- background: var(--guido-color-background-toaster-error);
45
- color: inherit;
46
- }
47
-
48
- ue-notifications-container .alert-message-wrapper.warn {
49
- background: var(--guido-color-background-toaster-warn);
50
- color: inherit;
51
- }
52
- `;
53
- export {
54
- n as default
55
- };
@@ -1,68 +0,0 @@
1
- const n = `ue-popup {
2
- -webkit-backdrop-filter: unset;
3
- backdrop-filter: unset;
4
- background-color: rgba(44, 53, 70, 0.5);
5
- }
6
-
7
- ue-popup .popup-wrapper {
8
- max-width: 400px;
9
- border: 1px solid var(--guido-color-neutral-200);
10
- box-shadow: none;
11
- background: var(--guido-color-white);
12
- font-size: 15px;
13
- line-height: 24px;
14
- }
15
-
16
- ue-popup .popup-title {
17
- padding: 32px 56px 0 32px;
18
- line-height: 24px;
19
- font-size: 20px;
20
- font-weight: 400;
21
- border-bottom: none;
22
- }
23
-
24
- ue-popup .confirmation .confirmation-wrapper {
25
- padding: 32px;
26
- gap: 16px;
27
- }
28
-
29
- ue-popup .confirmation .confirmation-actions {
30
- flex-direction: row-reverse;
31
- justify-content: space-between;
32
- }
33
-
34
- ue-popup .danger > .button {
35
- font-size: 15px;
36
- padding: 8px 16px;
37
- }
38
-
39
- ue-popup .e2e-cancel {
40
- margin-left: unset;
41
- }
42
-
43
- ue-popup .e2e-cancel .button {
44
- background-color: transparent;
45
- border: none;
46
- padding: 8px 0;
47
- font-size: 15px;
48
- }
49
-
50
- ue-popup .e2e-cancel .button:hover:not(:disabled,.disabled) {
51
- text-decoration: underline;
52
- background-color: transparent;
53
- }
54
-
55
- ue-popup .popup-close {
56
- top: 32px;
57
- right: 32px;
58
- }
59
-
60
- ue-popup .popup-close .button {
61
- padding: 0;
62
- min-width: unset;
63
- min-height: unset;
64
- }
65
- `;
66
- export {
67
- n as default
68
- };