@useinsider/guido 1.0.0-beta.614e7ff → 1.0.0-beta.637a8ae
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.
- package/dist/@types/generic.d.ts +2 -1
- package/dist/components/Guido.vue.d.ts +1 -2
- package/dist/components/Guido.vue.js +8 -8
- package/dist/components/Guido.vue2.js +35 -37
- package/dist/components/organisms/{design-preview/DesktopPreview.vue.d.ts → email-preview/EmailPreviewContainer.vue.d.ts} +2 -3
- package/dist/components/organisms/email-preview/EmailPreviewContainer.vue.js +17 -0
- package/dist/components/organisms/email-preview/EmailPreviewContainer.vue2.js +32 -0
- package/dist/components/organisms/email-preview/amp/AmpErrorModal.vue.js +19 -0
- package/dist/components/organisms/email-preview/amp/AmpErrorModal.vue2.js +37 -0
- package/dist/components/organisms/email-preview/amp/AmpToggle.vue.js +17 -0
- package/dist/components/organisms/email-preview/amp/AmpToggle.vue2.js +57 -0
- package/dist/components/organisms/{design-preview/EmailPreview.vue.d.ts → email-preview/desktop-preview/DesktopPreview.vue.d.ts} +3 -3
- package/dist/components/organisms/email-preview/desktop-preview/DesktopPreview.vue.js +22 -0
- package/dist/components/organisms/email-preview/desktop-preview/DesktopPreview.vue2.js +39 -0
- package/dist/components/organisms/email-preview/desktop-preview/EmailHeaderInfo.vue.d.ts +15 -0
- package/dist/components/organisms/email-preview/desktop-preview/EmailHeaderInfo.vue.js +17 -0
- package/dist/components/organisms/email-preview/desktop-preview/EmailHeaderInfo.vue2.js +15 -0
- package/dist/components/organisms/email-preview/desktop-preview/EmailSizeIndicator.vue.d.ts +19 -0
- package/dist/components/organisms/email-preview/desktop-preview/EmailSizeIndicator.vue.js +17 -0
- package/dist/components/organisms/email-preview/desktop-preview/EmailSizeIndicator.vue2.js +17 -0
- package/dist/components/organisms/{design-preview → email-preview/mobile-preview}/InboxView.vue.d.ts +2 -2
- package/dist/components/organisms/{design-preview → email-preview/mobile-preview}/InboxView.vue.js +2 -2
- package/dist/components/organisms/email-preview/mobile-preview/InboxView.vue2.js +23 -0
- package/dist/components/organisms/{design-preview → email-preview/mobile-preview}/MobilePreview.vue.d.ts +3 -3
- package/dist/components/organisms/email-preview/mobile-preview/MobilePreview.vue.js +17 -0
- package/dist/components/organisms/email-preview/mobile-preview/MobilePreview.vue2.js +27 -0
- package/dist/components/organisms/{design-preview/EmailView.vue.d.ts → email-preview/mobile-preview/OpenedEmailView.vue.d.ts} +2 -3
- package/dist/components/organisms/{design-preview/EmailView.vue.js → email-preview/mobile-preview/OpenedEmailView.vue.js} +4 -4
- package/dist/components/organisms/email-preview/mobile-preview/OpenedEmailView.vue2.js +26 -0
- package/dist/components/organisms/header/MiddleSlot.vue.js +4 -4
- package/dist/components/organisms/header/MiddleSlot.vue2.js +15 -16
- package/dist/components/organisms/header/RightSlot.vue.js +1 -1
- package/dist/components/organisms/header/RightSlot.vue2.js +18 -17
- package/dist/components/organisms/header/ViewOptions.vue.js +5 -5
- package/dist/components/organisms/header/ViewOptions.vue2.js +10 -8
- package/dist/components/wrappers/BaseModal.vue.d.ts +76 -0
- package/dist/components/wrappers/BaseModal.vue.js +19 -0
- package/dist/components/wrappers/BaseModal.vue2.js +22 -0
- package/dist/composables/useActionsApi.js +15 -15
- package/dist/composables/useCodeEditorApi.d.ts +5 -0
- package/dist/composables/useCodeEditorApi.js +17 -0
- package/dist/composables/useEmailResponsiveFit.d.ts +5 -0
- package/dist/composables/useEmailResponsiveFit.js +72 -0
- package/dist/composables/usePreviewMode.d.ts +6 -0
- package/dist/composables/usePreviewMode.js +21 -0
- package/dist/enums/defaults.js +10 -6
- package/dist/guido.css +1 -1
- package/dist/stores/editor.d.ts +0 -3
- package/dist/stores/editor.js +3 -6
- package/dist/stores/preview.d.ts +56 -0
- package/dist/stores/preview.js +23 -0
- package/package.json +1 -1
- package/dist/components/organisms/design-preview/AmpErrorModal.vue.js +0 -21
- package/dist/components/organisms/design-preview/AmpErrorModal.vue2.js +0 -30
- package/dist/components/organisms/design-preview/DesktopPreview.vue.js +0 -22
- package/dist/components/organisms/design-preview/DesktopPreview.vue2.js +0 -43
- package/dist/components/organisms/design-preview/EmailPreview.vue.js +0 -17
- package/dist/components/organisms/design-preview/EmailPreview.vue2.js +0 -33
- package/dist/components/organisms/design-preview/EmailView.vue2.js +0 -24
- package/dist/components/organisms/design-preview/InboxView.vue2.js +0 -23
- package/dist/components/organisms/design-preview/MobilePreview.vue.js +0 -17
- package/dist/components/organisms/design-preview/MobilePreview.vue2.js +0 -24
- package/dist/components/organisms/header/AmpToggle.vue.js +0 -17
- package/dist/components/organisms/header/AmpToggle.vue2.js +0 -48
- package/dist/composables/useMobileGmailFit.d.ts +0 -5
- package/dist/composables/useMobileGmailFit.js +0 -69
- package/dist/enums/emailPreview.d.ts +0 -3
- package/dist/enums/emailPreview.js +0 -4
- /package/dist/components/organisms/{design-preview → email-preview/amp}/AmpErrorModal.vue.d.ts +0 -0
- /package/dist/components/organisms/{header → email-preview/amp}/AmpToggle.vue.d.ts +0 -0
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { defineComponent as i, ref as s, computed as o } from "vue";
|
|
2
|
+
import c from "../../../../static/assets/inbox-mockup.svg.js";
|
|
3
|
+
import u from "../../../../static/assets/phone-mockup.svg.js";
|
|
4
|
+
import f from "./InboxView.vue.js";
|
|
5
|
+
import v from "./OpenedEmailView.vue.js";
|
|
6
|
+
const d = /* @__PURE__ */ i({
|
|
7
|
+
__name: "MobilePreview",
|
|
8
|
+
props: {
|
|
9
|
+
html: null,
|
|
10
|
+
isAmp: { type: Boolean },
|
|
11
|
+
emailHeader: null
|
|
12
|
+
},
|
|
13
|
+
setup(t) {
|
|
14
|
+
const n = t, e = s(!1), m = o(() => n.html), p = o(() => ({
|
|
15
|
+
image: e.value ? c : u,
|
|
16
|
+
alt: e.value ? "Inbox mockup" : "Phone mockup"
|
|
17
|
+
})), r = () => {
|
|
18
|
+
e.value = !1;
|
|
19
|
+
}, l = () => {
|
|
20
|
+
e.value = !0;
|
|
21
|
+
}, a = o(() => e.value ? "88px" : "44px");
|
|
22
|
+
return { __sfc: !0, props: n, showInbox: e, html: m, mockup: p, openEmail: r, backToInbox: l, phoneScreenTopMargin: a, InboxView: f, OpenedEmailView: v };
|
|
23
|
+
}
|
|
24
|
+
});
|
|
25
|
+
export {
|
|
26
|
+
d as default
|
|
27
|
+
};
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
interface Props {
|
|
2
|
-
|
|
3
|
-
isAmp
|
|
2
|
+
html: string;
|
|
3
|
+
isAmp: boolean;
|
|
4
4
|
}
|
|
5
5
|
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, {
|
|
6
6
|
"back-to-inbox": () => void;
|
|
7
|
-
load: () => void;
|
|
8
7
|
}, string, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<Props>>>, {}>;
|
|
9
8
|
export default _default;
|
|
10
9
|
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import n from "./
|
|
2
|
-
import c from "
|
|
1
|
+
import n from "./OpenedEmailView.vue2.js";
|
|
2
|
+
import c from "../../../../_virtual/_plugin-vue2_normalizer.js";
|
|
3
3
|
var e = function() {
|
|
4
4
|
var a = this, s = a._self._c, t = a._self._setupProxy;
|
|
5
|
-
return s("div", { staticClass: "w-1 h-1 b-c-4 d-f f-d-c" }, [s("div", { staticClass: "d-f j-c-s-b a-i-c p-2 h-6-s" }, [s("div", { staticClass: "d-f a-i-c cur-p", on: { click: function(
|
|
5
|
+
return s("div", { staticClass: "w-1 h-1 b-c-4 d-f f-d-c" }, [s("div", { staticClass: "d-f j-c-s-b a-i-c p-2 h-6-s" }, [s("div", { staticClass: "d-f a-i-c cur-p", on: { click: function(l) {
|
|
6
6
|
return a.$emit("back-to-inbox");
|
|
7
|
-
} } }, [s(t.InIcons, { staticClass: "f-s-3 i-c-7", attrs: { name: "line-chevron-left" } }), s("span", { staticClass: "ml-2 f-s-1 f-w-400 l-h-1 t-c-7" }, [a._v(a._s(t.trans("newsletter.inbox")))])], 1), s("div", { staticClass: "d-f a-i-c" }, [s(t.InIcons, { staticClass: "i-c-52", attrs: { name: "line-chevron-down" } }), s(t.InIcons, { staticClass: "ml-1 i-c-52", attrs: { name: "line-chevron-up" } })], 1)]), s("iframe", { ref: "iframeRef", staticClass: "f-g-1 w-1 d-b b-c-4 bor-s-n", attrs: { sandbox: "allow-same-origin allow-popups allow-forms allow-scripts", srcdoc:
|
|
7
|
+
} } }, [s(t.InIcons, { staticClass: "f-s-3 i-c-7", attrs: { name: "line-chevron-left" } }), s("span", { staticClass: "ml-2 f-s-1 f-w-400 l-h-1 t-c-7" }, [a._v(a._s(t.trans("newsletter.inbox")))])], 1), s("div", { staticClass: "d-f a-i-c" }, [s(t.InIcons, { staticClass: "i-c-52", attrs: { name: "line-chevron-down" } }), s(t.InIcons, { staticClass: "ml-1 i-c-52", attrs: { name: "line-chevron-up" } })], 1)]), s("iframe", { ref: "iframeRef", staticClass: "f-g-1 w-1 d-b b-c-4 bor-s-n", attrs: { sandbox: "allow-same-origin allow-popups allow-forms allow-scripts", srcdoc: t.html }, on: { load: t.onLoad } })]);
|
|
8
8
|
}, i = [], o = /* @__PURE__ */ c(
|
|
9
9
|
n,
|
|
10
10
|
e,
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { defineComponent as l, ref as u, computed as r } from "vue";
|
|
2
|
+
import { useEmailResponsiveFit as f } from "../../../../composables/useEmailResponsiveFit.js";
|
|
3
|
+
import { useTranslations as d } from "../../../../composables/useTranslations.js";
|
|
4
|
+
import { InIcons as h } from "@useinsider/design-system-vue";
|
|
5
|
+
const g = /* @__PURE__ */ l({
|
|
6
|
+
__name: "OpenedEmailView",
|
|
7
|
+
props: {
|
|
8
|
+
html: null,
|
|
9
|
+
isAmp: { type: Boolean }
|
|
10
|
+
},
|
|
11
|
+
emits: ["back-to-inbox"],
|
|
12
|
+
setup(a) {
|
|
13
|
+
const t = a, c = d(), n = u(), { setupEmailResponsiveFit: s } = f(), p = r(() => t.html), m = r(() => !!t.isAmp && t.html.includes("@media") && t.html.includes(".adapt-img")), i = (o) => {
|
|
14
|
+
["transform", "transform-origin", "height"].forEach((e) => {
|
|
15
|
+
o.documentElement.style.removeProperty(e);
|
|
16
|
+
});
|
|
17
|
+
};
|
|
18
|
+
return { __sfc: !0, props: t, trans: c, iframeRef: n, setupEmailResponsiveFit: s, html: p, isAMPResponsive: m, clearAMPTransforms: i, onLoad: () => {
|
|
19
|
+
const o = n.value, e = o == null ? void 0 : o.contentDocument;
|
|
20
|
+
e && (s(o), m.value && setTimeout(() => i(e), 50));
|
|
21
|
+
}, InIcons: h };
|
|
22
|
+
}
|
|
23
|
+
});
|
|
24
|
+
export {
|
|
25
|
+
g as default
|
|
26
|
+
};
|
|
@@ -2,16 +2,16 @@ import s from "./MiddleSlot.vue2.js";
|
|
|
2
2
|
import i from "../../../_virtual/_plugin-vue2_normalizer.js";
|
|
3
3
|
var n = function() {
|
|
4
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.
|
|
6
|
-
},
|
|
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, "selected-status": t.isPreviewModeOpen, "tooltip-options": t.getTooltipOptions("guido__preview-button"), "tooltip-text": t.previewTooltipText }, on: { click: t.togglePreviewMode } }), e(t.ViewOptions, { staticClass: "ml-3" }), t.isPreviewModeOpen ? e(t.AmpToggle) : o._e()], 1);
|
|
6
|
+
}, d = [], l = /* @__PURE__ */ i(
|
|
7
7
|
s,
|
|
8
8
|
n,
|
|
9
|
-
|
|
9
|
+
d,
|
|
10
10
|
!1,
|
|
11
11
|
null,
|
|
12
12
|
null
|
|
13
13
|
);
|
|
14
|
-
const u =
|
|
14
|
+
const u = l.exports;
|
|
15
15
|
export {
|
|
16
16
|
u as default
|
|
17
17
|
};
|
|
@@ -1,25 +1,24 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
1
|
+
import { defineComponent as n, computed as p } from "vue";
|
|
2
|
+
import { usePreviewMode as m } from "../../../composables/usePreviewMode.js";
|
|
3
|
+
import { useTranslations as l } from "../../../composables/useTranslations.js";
|
|
4
|
+
import a from "../email-preview/amp/AmpToggle.vue.js";
|
|
5
|
+
import { useEditorStore as f } from "../../../stores/editor.js";
|
|
4
6
|
import { InButtonV2 as c } from "@useinsider/design-system-vue";
|
|
5
|
-
import d from "./
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
|
|
9
|
-
const T = /* @__PURE__ */ s({
|
|
7
|
+
import d from "./version-history/VersionHistory.vue.js";
|
|
8
|
+
import u from "./version-history/ViewOptions.vue.js";
|
|
9
|
+
import w from "./ViewOptions.vue.js";
|
|
10
|
+
const H = /* @__PURE__ */ n({
|
|
10
11
|
__name: "MiddleSlot",
|
|
11
|
-
setup(
|
|
12
|
-
const o =
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
return { __sfc: !0, editorStore: o, trans: t, handlePreviewClick: e, isPreviewModeOpen: i, getTooltipOptions: (r) => ({
|
|
16
|
-
id: `${r}-tooltip`,
|
|
12
|
+
setup(_) {
|
|
13
|
+
const e = f(), o = l(), { isPreviewModeOpen: t, togglePreviewMode: i } = m(), r = p(() => o(t.value ? "newsletter.close-email-preview" : "newsletter.email-preview"));
|
|
14
|
+
return { __sfc: !0, editorStore: e, trans: o, isPreviewModeOpen: t, togglePreviewMode: i, previewTooltipText: r, getTooltipOptions: (s) => ({
|
|
15
|
+
id: `${s}-tooltip`,
|
|
17
16
|
dynamicPosition: !1,
|
|
18
17
|
staticPosition: "bottom center",
|
|
19
18
|
iconStatus: !1
|
|
20
|
-
}),
|
|
19
|
+
}), AmpToggle: a, InButtonV2: c, VersionHistory: d, VersionHistoryViewOptions: u, ViewOptions: w };
|
|
21
20
|
}
|
|
22
21
|
});
|
|
23
22
|
export {
|
|
24
|
-
|
|
23
|
+
H as default
|
|
25
24
|
};
|
|
@@ -2,7 +2,7 @@ import o from "./RightSlot.vue2.js";
|
|
|
2
2
|
import i from "../../../_virtual/_plugin-vue2_normalizer.js";
|
|
3
3
|
var n = function() {
|
|
4
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.
|
|
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.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.isPreviewModeOpen }, on: { click: t.handleSave } })], 1);
|
|
6
6
|
}, r = [], a = /* @__PURE__ */ i(
|
|
7
7
|
o,
|
|
8
8
|
n,
|
|
@@ -1,24 +1,25 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { useActionsApi as
|
|
3
|
-
import { useExport as
|
|
4
|
-
import { useSaveStart as
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
1
|
+
import { defineComponent as p } from "vue";
|
|
2
|
+
import { useActionsApi as c } from "../../../composables/useActionsApi.js";
|
|
3
|
+
import { useExport as l } from "../../../composables/useExport.js";
|
|
4
|
+
import { useSaveStart as f, useSaveComplete as d } from "../../../composables/useGuidoActions.js";
|
|
5
|
+
import { usePreviewMode as u } from "../../../composables/usePreviewMode.js";
|
|
6
|
+
import { useVersionHistoryApi as v } from "../../../composables/useVersionHistoryApi.js";
|
|
7
|
+
import { useEditorStore as S } from "../../../stores/editor.js";
|
|
8
|
+
import { InButtonV2 as h } from "@useinsider/design-system-vue";
|
|
9
|
+
const O = /* @__PURE__ */ p({
|
|
9
10
|
__name: "RightSlot",
|
|
10
|
-
setup(
|
|
11
|
-
const { exportHtml:
|
|
12
|
-
return { __sfc: !0, exportHtml:
|
|
13
|
-
if (
|
|
14
|
-
|
|
11
|
+
setup(y) {
|
|
12
|
+
const { exportHtml: m } = l(), { getCompiledEmail: e } = c(), t = f(), r = d(), { openVersionHistory: s, closeVersionHistory: i } = v(), n = S(), { isPreviewModeOpen: a } = u();
|
|
13
|
+
return { __sfc: !0, exportHtml: m, getCompiledEmail: e, saveStart: t, saveComplete: r, openVersionHistory: s, closeVersionHistory: i, editorStore: n, isPreviewModeOpen: a, handleVersionHistory: () => {
|
|
14
|
+
if (n.isVersionHistoryOpen) {
|
|
15
|
+
i();
|
|
15
16
|
return;
|
|
16
17
|
}
|
|
17
18
|
s();
|
|
18
19
|
}, handleSave: async () => {
|
|
19
|
-
|
|
20
|
+
t();
|
|
20
21
|
try {
|
|
21
|
-
const { html: o } = await
|
|
22
|
+
const { html: o } = await e();
|
|
22
23
|
r({
|
|
23
24
|
html: o || "",
|
|
24
25
|
css: ""
|
|
@@ -27,9 +28,9 @@ const E = /* @__PURE__ */ m({
|
|
|
27
28
|
} catch (o) {
|
|
28
29
|
console.error("Failed to get template data for save:", o);
|
|
29
30
|
}
|
|
30
|
-
}, InButtonV2:
|
|
31
|
+
}, InButtonV2: h };
|
|
31
32
|
}
|
|
32
33
|
});
|
|
33
34
|
export {
|
|
34
|
-
|
|
35
|
+
O as default
|
|
35
36
|
};
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import
|
|
1
|
+
import s from "./ViewOptions.vue2.js";
|
|
2
2
|
/* empty css */
|
|
3
3
|
import i from "../../../_virtual/_plugin-vue2_normalizer.js";
|
|
4
|
-
var
|
|
4
|
+
var r = 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.
|
|
6
|
+
return o(e.InSegments, { attrs: { id: "guido__view-option-selection", "with-icon": "", disable: e.isPreviewModeOpen, "segment-list": e.segmentList, selected: e.editorStore.editorVisualMode } });
|
|
7
7
|
}, n = [], _ = /* @__PURE__ */ i(
|
|
8
|
-
r,
|
|
9
8
|
s,
|
|
9
|
+
r,
|
|
10
10
|
n,
|
|
11
11
|
!1,
|
|
12
12
|
null,
|
|
13
|
-
"
|
|
13
|
+
"b81a01c5"
|
|
14
14
|
);
|
|
15
15
|
const l = _.exports;
|
|
16
16
|
export {
|
|
@@ -1,15 +1,17 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
|
|
1
|
+
import { defineComponent as i } from "vue";
|
|
2
|
+
import { usePreviewMode as n } from "../../../composables/usePreviewMode.js";
|
|
3
|
+
import { useEditorStore as r } from "../../../stores/editor.js";
|
|
4
|
+
import { InSegments as s } from "@useinsider/design-system-vue";
|
|
5
|
+
const f = /* @__PURE__ */ i({
|
|
5
6
|
__name: "ViewOptions",
|
|
6
|
-
setup(
|
|
7
|
-
|
|
7
|
+
setup(m) {
|
|
8
|
+
const e = r(), o = [
|
|
8
9
|
{ text: "", icon: "line-desktop", value: "desktop" },
|
|
9
10
|
{ text: "", icon: "line-menu-mobileapp", value: "mobile" }
|
|
10
|
-
],
|
|
11
|
+
], { isPreviewModeOpen: t } = n();
|
|
12
|
+
return { __sfc: !0, editorStore: e, segmentList: o, isPreviewModeOpen: t, InSegments: s };
|
|
11
13
|
}
|
|
12
14
|
});
|
|
13
15
|
export {
|
|
14
|
-
|
|
16
|
+
f as default
|
|
15
17
|
};
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
interface FooterButtonGroup {
|
|
2
|
+
primaryButton?: {
|
|
3
|
+
type: 'primary';
|
|
4
|
+
labelText: string;
|
|
5
|
+
disabledStatus?: boolean;
|
|
6
|
+
};
|
|
7
|
+
cancelOrBackButton?: {
|
|
8
|
+
type: 'secondary';
|
|
9
|
+
labelText: string;
|
|
10
|
+
styling: 'ghost';
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
type __VLS_Props = {
|
|
14
|
+
id: string;
|
|
15
|
+
title: string;
|
|
16
|
+
description?: string;
|
|
17
|
+
size?: 'small' | 'medium' | 'large';
|
|
18
|
+
footerButtonOptions?: FooterButtonGroup;
|
|
19
|
+
closeButtonStatus?: boolean;
|
|
20
|
+
closeOnOutsideClick?: boolean;
|
|
21
|
+
footerStatus?: boolean;
|
|
22
|
+
};
|
|
23
|
+
declare var __VLS_13: {};
|
|
24
|
+
type __VLS_Slots = {} & {
|
|
25
|
+
default?: (props: typeof __VLS_13) => any;
|
|
26
|
+
};
|
|
27
|
+
declare const __VLS_component: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<__VLS_Props>, {
|
|
28
|
+
description: string;
|
|
29
|
+
size: string;
|
|
30
|
+
footerButtonOptions: undefined;
|
|
31
|
+
closeButtonStatus: boolean;
|
|
32
|
+
closeOnOutsideClick: boolean;
|
|
33
|
+
footerStatus: boolean;
|
|
34
|
+
}>, {}, {}, {}, {}, import("vue/types/v3-component-options.js").ComponentOptionsMixin, import("vue/types/v3-component-options.js").ComponentOptionsMixin, {
|
|
35
|
+
close: () => void;
|
|
36
|
+
"primary-action": () => void;
|
|
37
|
+
"secondary-action": () => void;
|
|
38
|
+
}, string, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<__VLS_Props>, {
|
|
39
|
+
description: string;
|
|
40
|
+
size: string;
|
|
41
|
+
footerButtonOptions: undefined;
|
|
42
|
+
closeButtonStatus: boolean;
|
|
43
|
+
closeOnOutsideClick: boolean;
|
|
44
|
+
footerStatus: boolean;
|
|
45
|
+
}>>>, {
|
|
46
|
+
size: "small" | "medium" | "large";
|
|
47
|
+
description: string;
|
|
48
|
+
footerButtonOptions: FooterButtonGroup;
|
|
49
|
+
closeButtonStatus: boolean;
|
|
50
|
+
closeOnOutsideClick: boolean;
|
|
51
|
+
footerStatus: boolean;
|
|
52
|
+
}>;
|
|
53
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
54
|
+
export default _default;
|
|
55
|
+
type __VLS_WithDefaults<P, D> = {
|
|
56
|
+
[K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_PrettifyLocal<P[K] & {
|
|
57
|
+
default: D[K];
|
|
58
|
+
}> : P[K];
|
|
59
|
+
};
|
|
60
|
+
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
61
|
+
type __VLS_TypePropsToOption<T> = {
|
|
62
|
+
[K in keyof T]-?: {} extends Pick<T, K> ? {
|
|
63
|
+
type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
|
|
64
|
+
} : {
|
|
65
|
+
type: import('vue').PropType<T[K]>;
|
|
66
|
+
required: true;
|
|
67
|
+
};
|
|
68
|
+
};
|
|
69
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
70
|
+
new (): {
|
|
71
|
+
$scopedSlots: S;
|
|
72
|
+
};
|
|
73
|
+
};
|
|
74
|
+
type __VLS_PrettifyLocal<T> = {
|
|
75
|
+
[K in keyof T]: T[K];
|
|
76
|
+
} & {};
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import n from "./BaseModal.vue2.js";
|
|
2
|
+
import s from "../../_virtual/_plugin-vue2_normalizer.js";
|
|
3
|
+
var r = function() {
|
|
4
|
+
var t = this, o = t._self._c, e = t._self._setupProxy;
|
|
5
|
+
return o(e.InModalV2, { attrs: { id: t.id, "description-status": "", status: "", "close-button-status": t.closeButtonStatus, "close-on-outside-click": t.closeOnOutsideClick, "description-text": t.description, "footer-button-group-options": t.footerButtonOptions, "footer-status": t.footerStatus, size: t.size, "title-text": t.title }, on: { cancelOrBackButtonEvent: e.handleClose, onCloseEvent: e.handleClose, primaryButtonEvent: e.handlePrimaryAction, secondaryButtonEvent: e.handleSecondaryAction }, scopedSlots: t._u([{ key: "contentSlot", fn: function() {
|
|
6
|
+
return [t._t("default")];
|
|
7
|
+
}, proxy: !0 }], null, !0) });
|
|
8
|
+
}, l = [], a = /* @__PURE__ */ s(
|
|
9
|
+
n,
|
|
10
|
+
r,
|
|
11
|
+
l,
|
|
12
|
+
!1,
|
|
13
|
+
null,
|
|
14
|
+
null
|
|
15
|
+
);
|
|
16
|
+
const d = a.exports;
|
|
17
|
+
export {
|
|
18
|
+
d as default
|
|
19
|
+
};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { defineComponent as e } from "vue";
|
|
2
|
+
import { InModalV2 as t } from "@useinsider/design-system-vue";
|
|
3
|
+
const d = /* @__PURE__ */ e({
|
|
4
|
+
__name: "BaseModal",
|
|
5
|
+
props: {
|
|
6
|
+
id: null,
|
|
7
|
+
title: null,
|
|
8
|
+
description: { default: "" },
|
|
9
|
+
size: { default: "small" },
|
|
10
|
+
footerButtonOptions: { default: void 0 },
|
|
11
|
+
closeButtonStatus: { type: Boolean, default: !0 },
|
|
12
|
+
closeOnOutsideClick: { type: Boolean, default: !0 },
|
|
13
|
+
footerStatus: { type: Boolean, default: !0 }
|
|
14
|
+
},
|
|
15
|
+
emits: ["close", "primary-action", "secondary-action"],
|
|
16
|
+
setup(n, { emit: o }) {
|
|
17
|
+
return { __sfc: !0, emit: o, handleClose: () => o("close"), handlePrimaryAction: () => o("primary-action"), handleSecondaryAction: () => o("secondary-action"), InModalV2: t };
|
|
18
|
+
}
|
|
19
|
+
});
|
|
20
|
+
export {
|
|
21
|
+
d as default
|
|
22
|
+
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
const w = () => {
|
|
2
|
-
const
|
|
3
|
-
const
|
|
2
|
+
const i = (e = {}) => new Promise((t, s) => {
|
|
3
|
+
const o = { ...{
|
|
4
4
|
minimize: !0,
|
|
5
5
|
utmEntity: {
|
|
6
6
|
utmSource: "",
|
|
@@ -16,30 +16,30 @@ const w = () => {
|
|
|
16
16
|
]
|
|
17
17
|
},
|
|
18
18
|
mergeTags: ["Tag1", "Tag2"],
|
|
19
|
-
|
|
19
|
+
forseAMP: !1,
|
|
20
20
|
resetDataSavedFlag: !1,
|
|
21
21
|
disableLineHeightsReplace: !0
|
|
22
|
-
}, ...e },
|
|
23
|
-
callback: (
|
|
24
|
-
|
|
25
|
-
html:
|
|
26
|
-
|
|
27
|
-
|
|
22
|
+
}, ...e }, n = {
|
|
23
|
+
callback: (a, l, m, r, c) => {
|
|
24
|
+
a ? s(a) : t({
|
|
25
|
+
html: l,
|
|
26
|
+
AMPHtml: m,
|
|
27
|
+
AMPErrors: r,
|
|
28
28
|
displayConditions: c
|
|
29
29
|
});
|
|
30
30
|
},
|
|
31
|
-
...
|
|
31
|
+
...o
|
|
32
32
|
};
|
|
33
|
-
window.StripoEditorApi.actionsApi.compileEmail(
|
|
33
|
+
window.StripoEditorApi.actionsApi.compileEmail(n);
|
|
34
34
|
});
|
|
35
|
-
return { getCompiledEmail:
|
|
35
|
+
return { getCompiledEmail: i, activateCustomViewStyles: (e = !0) => {
|
|
36
36
|
window.StripoEditorApi.actionsApi.activateCustomViewStyles(e);
|
|
37
37
|
}, getPreviewData: async (e) => {
|
|
38
|
-
const t = await
|
|
38
|
+
const t = await i({ minimize: !1, resetDataSavedFlag: !1, ...e });
|
|
39
39
|
return {
|
|
40
40
|
html: t.html,
|
|
41
|
-
|
|
42
|
-
|
|
41
|
+
AMPHtml: t.AMPHtml ?? "",
|
|
42
|
+
AMPErrors: t.AMPErrors ?? [],
|
|
43
43
|
displayConditions: t.displayConditions
|
|
44
44
|
};
|
|
45
45
|
} };
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
const t = () => ({
|
|
2
|
+
openCodeEditor: () => {
|
|
3
|
+
var o, i;
|
|
4
|
+
return (i = (o = window.StripoEditorApi) == null ? void 0 : o.codeEditorApi) != null && i.openCodeEditor ? (window.StripoEditorApi.codeEditorApi.openCodeEditor(), !0) : !1;
|
|
5
|
+
},
|
|
6
|
+
closeCodeEditor: () => {
|
|
7
|
+
var o, i;
|
|
8
|
+
return (i = (o = window.StripoEditorApi) == null ? void 0 : o.codeEditorApi) != null && i.closeCodeEditor ? (window.StripoEditorApi.codeEditorApi.closeCodeEditor(), !0) : !1;
|
|
9
|
+
},
|
|
10
|
+
isCodeEditorApiAvailable: () => {
|
|
11
|
+
var o;
|
|
12
|
+
return !!((o = window.StripoEditorApi) != null && o.codeEditorApi);
|
|
13
|
+
}
|
|
14
|
+
});
|
|
15
|
+
export {
|
|
16
|
+
t as useCodeEditorApi
|
|
17
|
+
};
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
import { useDebounce as E } from "./useDebounce.js";
|
|
2
|
+
import { META_VIEWPORT_REGEX as d, INLINE_WIDTH_REGEX as p, EMAIL_CONTAINER_SELECTORS as h, DEFAULT_EMAIL_WIDTH as w, MIN_SCALE as v, TABLE_WIDTH_REGEX as f, RESIZE_DEBOUNCE_MS as u } from "../enums/gmailMobilePreview.js";
|
|
3
|
+
let a = null, c = null;
|
|
4
|
+
const { debounce: y } = E(), b = (t) => {
|
|
5
|
+
if (!t)
|
|
6
|
+
return null;
|
|
7
|
+
const s = t.match(f);
|
|
8
|
+
if (!s)
|
|
9
|
+
return null;
|
|
10
|
+
const i = Number(s[1]);
|
|
11
|
+
return Number.isNaN(i) ? null : i;
|
|
12
|
+
}, A = (t) => {
|
|
13
|
+
const s = Array.from(t.querySelectorAll("table[width]")).reduce(
|
|
14
|
+
(e, o) => {
|
|
15
|
+
const r = b(o.getAttribute("width"));
|
|
16
|
+
return r && r > e ? r : e;
|
|
17
|
+
},
|
|
18
|
+
0
|
|
19
|
+
), i = Array.from(t.querySelectorAll('[style*="width"]')).reduce(
|
|
20
|
+
(e, o) => {
|
|
21
|
+
const l = (o.getAttribute("style") || "").match(p);
|
|
22
|
+
if (!l)
|
|
23
|
+
return e;
|
|
24
|
+
const m = Number(l[1]);
|
|
25
|
+
return !Number.isNaN(m) && m > e ? m : e;
|
|
26
|
+
},
|
|
27
|
+
0
|
|
28
|
+
), n = h.reduce((e, o) => {
|
|
29
|
+
const r = t.querySelector(o);
|
|
30
|
+
if (!r)
|
|
31
|
+
return e;
|
|
32
|
+
const l = Math.max(r.offsetWidth, r.scrollWidth);
|
|
33
|
+
return l > e ? l : e;
|
|
34
|
+
}, 0);
|
|
35
|
+
return Math.max(s, i, n) || w;
|
|
36
|
+
}, R = (t) => {
|
|
37
|
+
t.documentElement.style.setProperty("overflow-x", "visible", "important"), t.body.style.setProperty("visibility", "visible", "important");
|
|
38
|
+
}, g = (t) => {
|
|
39
|
+
t.documentElement.style.removeProperty("transform"), t.documentElement.style.removeProperty("transform-origin"), t.documentElement.style.removeProperty("height"), t.body.style.removeProperty("overflow-x");
|
|
40
|
+
}, N = (t, s) => {
|
|
41
|
+
const i = A(t), n = s / i, e = Math.min(Math.max(n, v), 1);
|
|
42
|
+
t.documentElement.style.setProperty("height", "100%", "important"), t.documentElement.style.setProperty("transform", `scale(${e})`, "important"), t.documentElement.style.setProperty("transform-origin", "top left", "important"), t.body.style.setProperty("overflow-x", "hidden", "important");
|
|
43
|
+
}, _ = () => {
|
|
44
|
+
const t = (n) => {
|
|
45
|
+
const e = n.contentWindow;
|
|
46
|
+
c && e && e.removeEventListener("resize", c), a && window.removeEventListener("resize", a), c = null, a = null;
|
|
47
|
+
}, s = (n) => {
|
|
48
|
+
const e = n.querySelector('meta[name="viewport"]');
|
|
49
|
+
if (!e)
|
|
50
|
+
return !1;
|
|
51
|
+
const o = e.getAttribute("content") || "";
|
|
52
|
+
return d.test(o);
|
|
53
|
+
};
|
|
54
|
+
return { setupEmailResponsiveFit: (n) => {
|
|
55
|
+
const e = n.contentDocument, o = n.contentWindow;
|
|
56
|
+
if (!e || !o)
|
|
57
|
+
return;
|
|
58
|
+
R(e);
|
|
59
|
+
const r = () => {
|
|
60
|
+
const l = n.clientWidth || n.getBoundingClientRect().width || 375;
|
|
61
|
+
if (s(e)) {
|
|
62
|
+
g(e);
|
|
63
|
+
return;
|
|
64
|
+
}
|
|
65
|
+
N(e, l);
|
|
66
|
+
};
|
|
67
|
+
r(), t(n), c = () => y(r, u), o.addEventListener("resize", c), a = () => y(r, u), window.addEventListener("resize", a);
|
|
68
|
+
}, tearDownEmailResponsiveFit: t, hasResponsiveMetaViewport: s };
|
|
69
|
+
};
|
|
70
|
+
export {
|
|
71
|
+
_ as useEmailResponsiveFit
|
|
72
|
+
};
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { useEditorStore as i } from "../stores/editor.js";
|
|
2
|
+
import { computed as r } from "vue";
|
|
3
|
+
import { useCodeEditorApi as d } from "./useCodeEditorApi.js";
|
|
4
|
+
const P = () => {
|
|
5
|
+
const e = i(), { closeCodeEditor: o } = d();
|
|
6
|
+
return {
|
|
7
|
+
isPreviewModeOpen: r(() => e.isPreviewModeOpen),
|
|
8
|
+
togglePreviewMode: () => {
|
|
9
|
+
!e.isPreviewModeOpen && e.isCodeEditorOpen && (o(), e.isCodeEditorOpen = !1), e.isPreviewModeOpen = !e.isPreviewModeOpen;
|
|
10
|
+
},
|
|
11
|
+
closePreviewMode: () => {
|
|
12
|
+
e.isPreviewModeOpen = !1;
|
|
13
|
+
},
|
|
14
|
+
openPreviewMode: () => {
|
|
15
|
+
e.isCodeEditorOpen && (o(), e.isCodeEditorOpen = !1), e.isPreviewModeOpen = !0;
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
export {
|
|
20
|
+
P as usePreviewMode
|
|
21
|
+
};
|
package/dist/enums/defaults.js
CHANGED
|
@@ -1,8 +1,12 @@
|
|
|
1
|
-
const
|
|
2
|
-
translationsPath: "window.trans.en"
|
|
3
|
-
|
|
1
|
+
const e = {
|
|
2
|
+
translationsPath: "window.trans.en",
|
|
3
|
+
emailHeader: {
|
|
4
|
+
senderName: "Default Sender",
|
|
5
|
+
subject: "Default Subject"
|
|
6
|
+
}
|
|
7
|
+
}, t = "newsletter", a = "Guido User";
|
|
4
8
|
export {
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
9
|
+
e as DefaultGuidoConfig,
|
|
10
|
+
t as DefaultProductType,
|
|
11
|
+
a as DefaultUsername
|
|
8
12
|
};
|
package/dist/guido.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
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-b81a01c5] .guido__view-option-selection-desktop svg,[data-v-b81a01c5] .guido__view-option-selection-mobile svg{margin:0 0 0 2px}[data-v-b81a01c5] .in-segments-wrapper__button_selected,[data-v-b81a01c5] .in-segments-wrapper__button_selected:hover{background-color:#dae1fb}.guido-editor__wrapper[data-v-988dfdfd],.guido-editor__container[data-v-988dfdfd]{width:100%;height:calc(100vh - 75px)}[data-v-9a504b0d] .in-progress-wrapper__progress p span:last-child{display:none!important}.desktop-preview-container[data-v-9a504b0d],[data-v-9a504b0d] .desktop-preview-container .in-container{min-height:720px!important;height:100%}
|
package/dist/stores/editor.d.ts
CHANGED
|
@@ -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
|
}, {}, {}>;
|