@useinsider/guido 3.6.0-beta.32a6a93 → 3.6.0-beta.3c5ea31
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/README.md +0 -14
- package/dist/components/Guido.vue.js +1 -1
- package/dist/components/Guido.vue2.js +72 -75
- package/dist/components/organisms/header/EditorActions.vue.js +1 -1
- package/dist/components/organisms/header/EditorActions.vue2.js +6 -6
- package/dist/components/organisms/header/LeftSlot.vue.js +1 -1
- package/dist/components/organisms/header/LeftSlot.vue2.js +9 -9
- package/dist/composables/useRecommendation.js +34 -33
- package/dist/extensions/Blocks/Recommendation/controls/main/index.js +10 -12
- package/dist/extensions/Blocks/Recommendation/controls/main/layoutOrientation.js +24 -32
- package/dist/extensions/Blocks/Recommendation/controls/main/productLayout.js +34 -40
- package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +286 -329
- package/dist/extensions/Blocks/Recommendation/extension.js +6 -5
- package/dist/extensions/Blocks/Recommendation/settingsPanel.js +3 -2
- package/dist/extensions/Blocks/Recommendation/store/recommendation.js +13 -9
- package/dist/extensions/Blocks/Recommendation/templates/grid/elementRenderer.js +139 -168
- package/dist/extensions/Blocks/Recommendation/templates/grid/template.js +56 -30
- package/dist/extensions/Blocks/Recommendation/templates/index.js +29 -8
- package/dist/extensions/Blocks/Recommendation/templates/list/elementRenderer.js +132 -105
- package/dist/extensions/Blocks/Recommendation/templates/list/template.js +44 -23
- package/dist/extensions/Blocks/Recommendation/templates/utils.js +98 -55
- package/dist/extensions/Blocks/Recommendation/utils/captureStyleTemplates.js +207 -0
- package/dist/extensions/Blocks/Recommendation/utils/partnerCustomizations.js +21 -0
- package/dist/extensions/Blocks/Recommendation/utils/preserveTextStyles.js +24 -19
- package/dist/extensions/Blocks/Recommendation/utils/tagName.js +20 -16
- package/dist/extensions/Blocks/controlFactories.js +159 -133
- package/dist/guido.css +1 -1
- package/dist/src/components/Guido.vue.d.ts +0 -1
- package/dist/src/extensions/Blocks/Items/controls/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/controls/button/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts +20 -47
- package/dist/src/extensions/Blocks/Recommendation/templates/grid/elementRenderer.test.d.ts +1 -0
- package/dist/src/extensions/Blocks/Recommendation/templates/grid/template.d.ts +4 -4
- package/dist/src/extensions/Blocks/Recommendation/templates/index.d.ts +1 -1
- package/dist/src/extensions/Blocks/Recommendation/templates/list/elementRenderer.test.d.ts +1 -0
- package/dist/src/extensions/Blocks/Recommendation/templates/list/template.d.ts +3 -2
- package/dist/src/extensions/Blocks/Recommendation/templates/utils.d.ts +158 -11
- package/dist/src/extensions/Blocks/Recommendation/templates/utils.test.d.ts +1 -0
- package/dist/src/extensions/Blocks/Recommendation/utils/captureStyleTemplates.d.ts +85 -0
- package/dist/src/extensions/Blocks/Recommendation/utils/captureStyleTemplates.test.d.ts +1 -0
- package/dist/src/extensions/Blocks/Recommendation/utils/partnerCustomizations.d.ts +7 -0
- package/dist/src/extensions/Blocks/Recommendation/utils/preserveTextStyles.d.ts +15 -0
- package/dist/src/extensions/Blocks/Recommendation/utils/preserveTextStyles.test.d.ts +1 -0
- package/dist/src/extensions/Blocks/Recommendation/utils/tagName.d.ts +20 -9
- package/dist/src/extensions/Blocks/controlFactories.d.ts +11 -1
- package/package.json +1 -1
- package/dist/src/extensions/Blocks/Recommendation/utils/stylePreserver.d.ts +0 -113
package/README.md
CHANGED
|
@@ -246,20 +246,6 @@ guidoRef.value?.dynamicContent.close();
|
|
|
246
246
|
|
|
247
247
|
// Silent save (no UI feedback)
|
|
248
248
|
guidoRef.value?.saveSilent();
|
|
249
|
-
|
|
250
|
-
// Control the editor's full-screen loader for flows Guido can't see.
|
|
251
|
-
// Guido shows the loader automatically for manual saves; use setLoading()
|
|
252
|
-
// when your app keeps the editor mounted after a save and needs to drive it:
|
|
253
|
-
|
|
254
|
-
// • Release the loader when a save is blocked/rejected and you stay in the
|
|
255
|
-
// editor (e.g. a post-save domain-allowlist error you surface in place),
|
|
256
|
-
// so the editor isn't left stuck on the spinner:
|
|
257
|
-
guidoRef.value?.setLoading(false);
|
|
258
|
-
|
|
259
|
-
// • Raise the loader to cover a host-initiated navigation (e.g. a
|
|
260
|
-
// save-and-leave flow) so the editor doesn't flash before your route
|
|
261
|
-
// changes — release it again if that save turns out to be blocked:
|
|
262
|
-
guidoRef.value?.setLoading(true);
|
|
263
249
|
```
|
|
264
250
|
|
|
265
251
|
---
|
|
@@ -1,72 +1,70 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { useCortexBlueprintBridge as
|
|
3
|
-
import { provideGuidoActions as
|
|
4
|
-
import { useGuidoStateBridge as
|
|
5
|
-
import { usePartner as
|
|
6
|
-
import { useStripo as
|
|
7
|
-
import { useTimerClone as
|
|
8
|
-
import { migrate as
|
|
9
|
-
import { ModuleFolderDefaults as
|
|
1
|
+
import { defineComponent as Q, defineAsyncComponent as N, ref as I, computed as W, watch as X, onMounted as Y, onUnmounted as Z } from "vue";
|
|
2
|
+
import { useCortexBlueprintBridge as ee } from "../composables/useCortexBlueprintBridge.js";
|
|
3
|
+
import { provideGuidoActions as oe } from "../composables/useGuidoActions.js";
|
|
4
|
+
import { useGuidoStateBridge as te } from "../composables/useGuidoStateBridge.js";
|
|
5
|
+
import { usePartner as ne } from "../composables/usePartner.js";
|
|
6
|
+
import { useStripo as re } from "../composables/useStripo.js";
|
|
7
|
+
import { useTimerClone as se } from "../composables/useTimerClone.js";
|
|
8
|
+
import { migrate as x } from "../config/migrator/index.js";
|
|
9
|
+
import { ModuleFolderDefaults as G } from "../enums/defaults.js";
|
|
10
10
|
import { RIBBON_SELECTOR as ce } from "../enums/onboarding.js";
|
|
11
|
-
import { useRecommendationExtensionStore as
|
|
12
|
-
import
|
|
13
|
-
import
|
|
14
|
-
import
|
|
15
|
-
import
|
|
16
|
-
import
|
|
17
|
-
import
|
|
18
|
-
import
|
|
19
|
-
import { useStripoApi as
|
|
11
|
+
import { useRecommendationExtensionStore as ae } from "../extensions/Blocks/Recommendation/store/recommendation.js";
|
|
12
|
+
import ie from "./organisms/AutoSaveController.vue.js";
|
|
13
|
+
import me from "./organisms/base/Toaster.vue.js";
|
|
14
|
+
import de from "./organisms/extensions/recommendation/FilterSelectionDrawer.vue.js";
|
|
15
|
+
import le from "./organisms/header/HeaderWrapper.vue.js";
|
|
16
|
+
import ue from "./organisms/LoadingWrapper.vue.js";
|
|
17
|
+
import pe from "./organisms/save-as-template/SaveAsTemplateDrawer.vue.js";
|
|
18
|
+
import fe from "./organisms/unsubscribe/UnsubscribeWrapper.vue.js";
|
|
19
|
+
import { useStripoApi as ve } from "../services/stripoApi.js";
|
|
20
20
|
import { useConfigStore as ye } from "../stores/config.js";
|
|
21
|
-
import { useDynamicContentStore as
|
|
22
|
-
import { useEditorStore as
|
|
23
|
-
import { usePreviewStore as
|
|
21
|
+
import { useDynamicContentStore as Se } from "../stores/dynamic-content.js";
|
|
22
|
+
import { useEditorStore as H } from "../stores/editor.js";
|
|
23
|
+
import { usePreviewStore as he } from "../stores/preview.js";
|
|
24
24
|
import { useTemplateStore as be } from "../stores/template.js";
|
|
25
|
-
import { useUnsubscribeStore as
|
|
26
|
-
const
|
|
25
|
+
import { useUnsubscribeStore as ge } from "../stores/unsubscribe.js";
|
|
26
|
+
const Ke = /* @__PURE__ */ Q({
|
|
27
27
|
__name: "Guido",
|
|
28
28
|
props: {
|
|
29
29
|
config: null
|
|
30
30
|
},
|
|
31
31
|
emits: ["dynamic-content:open", "back", "save:start", "save:complete", "on-change", "ready", "onboarding:finished", "test-email:click"],
|
|
32
|
-
setup(
|
|
33
|
-
const
|
|
32
|
+
setup($, { expose: z, emit: n }) {
|
|
33
|
+
const g = $, q = N(
|
|
34
34
|
() => import("./organisms/email-preview/PreviewContainer.vue.js")
|
|
35
|
-
),
|
|
35
|
+
), K = N(
|
|
36
36
|
() => import("./organisms/onboarding/OnboardingWrapper.vue.js")
|
|
37
|
-
), E =
|
|
38
|
-
i.init(
|
|
39
|
-
const
|
|
37
|
+
), E = I(), u = I(), p = Se(), w = ge(), i = ye();
|
|
38
|
+
i.init(g.config);
|
|
39
|
+
const f = H(), V = he(), m = W(() => f.hasChanges), { isTestPartner: j } = ne(), D = () => {
|
|
40
40
|
var e;
|
|
41
41
|
return (e = E.value) == null ? void 0 : e.handleSave(!0);
|
|
42
|
-
}, C = (e) => {
|
|
43
|
-
m.loadingStatus = e;
|
|
44
42
|
}, {
|
|
45
43
|
templateId: v,
|
|
46
|
-
userId:
|
|
47
|
-
partnerName:
|
|
44
|
+
userId: C,
|
|
45
|
+
partnerName: T,
|
|
48
46
|
username: k,
|
|
49
47
|
template: o,
|
|
50
48
|
editor: s
|
|
51
|
-
} = i,
|
|
52
|
-
|
|
53
|
-
const
|
|
49
|
+
} = i, d = (o == null ? void 0 : o.html) || "", F = (o == null ? void 0 : o.css) || "", y = (o == null ? void 0 : o.preselectedDynamicContent) || [], L = (s == null ? void 0 : s.savedModulesFolderName) || G.SAVED_MODULES, U = (s == null ? void 0 : s.defaultModulesFolderName) || G.DEFAULT_MODULES;
|
|
50
|
+
ee(), te();
|
|
51
|
+
const S = {
|
|
54
52
|
emailId: v,
|
|
55
|
-
userId:
|
|
53
|
+
userId: C,
|
|
56
54
|
username: k,
|
|
57
|
-
partnerName:
|
|
58
|
-
savedModulesFolderName:
|
|
59
|
-
defaultModulesFolderName:
|
|
60
|
-
},
|
|
61
|
-
preselectedDynamicContentList:
|
|
55
|
+
partnerName: T,
|
|
56
|
+
savedModulesFolderName: L,
|
|
57
|
+
defaultModulesFolderName: U
|
|
58
|
+
}, _ = {
|
|
59
|
+
preselectedDynamicContentList: y,
|
|
62
60
|
onReady: () => {
|
|
63
61
|
console.debug("guido:ready"), n("ready");
|
|
64
62
|
}
|
|
65
|
-
}, { initPlugin:
|
|
63
|
+
}, { initPlugin: M } = re(S, _), { getDefaultTemplate: O } = ve(), { cloneTimersOnSave: P, hasTimerBlocks: R } = se(), J = W(() => {
|
|
66
64
|
var e;
|
|
67
65
|
return !((e = i.ui) != null && e.showHeader);
|
|
68
66
|
});
|
|
69
|
-
|
|
67
|
+
oe({
|
|
70
68
|
onBack: () => {
|
|
71
69
|
console.debug("guido:back"), n("back");
|
|
72
70
|
},
|
|
@@ -74,67 +72,66 @@ const Ve = /* @__PURE__ */ X({
|
|
|
74
72
|
console.debug("guido:save:start"), n("save:start");
|
|
75
73
|
},
|
|
76
74
|
onSaveComplete: (e) => {
|
|
77
|
-
const t = { ...e, metadata:
|
|
75
|
+
const t = { ...e, metadata: S };
|
|
78
76
|
console.debug("guido:save:complete", t), n("save:complete", t);
|
|
79
77
|
},
|
|
80
78
|
onTestEmailClick: () => {
|
|
81
79
|
console.debug("guido:test-email:click"), n("test-email:click");
|
|
82
80
|
}
|
|
83
81
|
});
|
|
84
|
-
const
|
|
85
|
-
console.debug("dynamic-content:close", e),
|
|
86
|
-
},
|
|
82
|
+
const A = (e) => {
|
|
83
|
+
console.debug("dynamic-content:close", e), p.setSelectedDynamicContent(e), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: e }));
|
|
84
|
+
}, B = () => {
|
|
87
85
|
console.debug("dynamic-content:close", "Without Data"), document.dispatchEvent(new CustomEvent("dynamic-content:close", { detail: { text: "", value: "" } }));
|
|
88
86
|
};
|
|
89
|
-
|
|
90
|
-
n("on-change",
|
|
87
|
+
X(() => m.value, () => {
|
|
88
|
+
n("on-change", m.value);
|
|
91
89
|
});
|
|
92
90
|
const h = (e) => {
|
|
93
|
-
const t = e, { attribute:
|
|
94
|
-
console.debug("dynamic-content:open", t.detail), n("dynamic-content:open",
|
|
91
|
+
const t = e, { attribute: l, position: a } = t.detail;
|
|
92
|
+
console.debug("dynamic-content:open", t.detail), n("dynamic-content:open", l, a);
|
|
95
93
|
};
|
|
96
|
-
let
|
|
97
|
-
const
|
|
94
|
+
let c = null;
|
|
95
|
+
const b = () => {
|
|
98
96
|
var t;
|
|
99
97
|
const e = document.querySelector(ce);
|
|
100
|
-
(t =
|
|
98
|
+
(t = u.value) == null || t.style.setProperty("--ribbon-offset", `${(e == null ? void 0 : e.offsetHeight) ?? 0}px`);
|
|
101
99
|
};
|
|
102
|
-
return
|
|
103
|
-
var t,
|
|
104
|
-
console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow"),
|
|
105
|
-
const e = (t =
|
|
106
|
-
e && (
|
|
100
|
+
return Y(async () => {
|
|
101
|
+
var t, l;
|
|
102
|
+
console.debug("Guido says happy coding 🎉"), console.debug("🚗 Ka-Chow"), ae().$reset(), H().$reset(), f.templateId = v, be().$reset(), b();
|
|
103
|
+
const e = (t = u.value) == null ? void 0 : t.parentElement;
|
|
104
|
+
e && (c = new ResizeObserver(b), c.observe(e));
|
|
107
105
|
try {
|
|
108
106
|
w.selectedUnsubscribePages = (o == null ? void 0 : o.selectedUnsubscribePages) || [];
|
|
109
|
-
const
|
|
107
|
+
const a = ((l = o == null ? void 0 : o.migration) == null ? void 0 : l.recommendationConfigs) ?? {};
|
|
110
108
|
let r = {
|
|
111
|
-
html:
|
|
109
|
+
html: d && await x(d, a),
|
|
112
110
|
css: F
|
|
113
111
|
};
|
|
114
|
-
r.html || (r = await
|
|
115
|
-
} catch (
|
|
116
|
-
console.error("Failed to initialize Stripo editor:",
|
|
112
|
+
r.html || (r = await O(), r.html = await x(r.html, a)), R(r.html) && (r.html = await P(r.html)), await M(r), p.selectedDynamicContentList = y;
|
|
113
|
+
} catch (a) {
|
|
114
|
+
console.error("Failed to initialize Stripo editor:", a);
|
|
117
115
|
}
|
|
118
116
|
document.addEventListener("dynamic-content:open", h);
|
|
119
|
-
}),
|
|
120
|
-
|
|
117
|
+
}), Z(() => {
|
|
118
|
+
c == null || c.disconnect(), document.removeEventListener("dynamic-content:open", h);
|
|
121
119
|
try {
|
|
122
120
|
window.UIEditor.removeEditor();
|
|
123
121
|
} catch {
|
|
124
122
|
console.debug("Failed to remove Stripo editor: No editor found");
|
|
125
123
|
}
|
|
126
124
|
i.reset();
|
|
127
|
-
}),
|
|
125
|
+
}), z({
|
|
128
126
|
dynamicContent: {
|
|
129
|
-
insert:
|
|
130
|
-
close:
|
|
127
|
+
insert: A,
|
|
128
|
+
close: B
|
|
131
129
|
},
|
|
132
|
-
hasChanges:
|
|
133
|
-
saveSilent: D
|
|
134
|
-
|
|
135
|
-
}), { __sfc: !0, PreviewContainer: K, OnboardingWrapper: V, headerWrapperRef: E, wrapperRef: p, dynamicContentStore: f, unsubscribeStore: w, props: b, configStore: i, editorStore: m, previewStore: j, hasChanges: d, isTestPartner: J, saveSilent: D, setLoading: C, templateId: v, userId: T, partnerName: L, username: k, templateConfig: o, editorConfig: s, html: l, css: F, preselectedDynamicContentList: S, savedModulesFolderName: U, defaultModulesFolderName: _, emit: n, metadata: y, options: M, initPlugin: O, getDefaultTemplate: P, cloneTimersOnSave: R, hasTimerBlocks: A, noHeader: Q, insertDynamicContent: B, closeDynamicContent: N, handleDynamicContentOpen: h, ribbonObserver: a, updateRibbonOffset: g, AutoSaveController: me, Toaster: de, FilterSelectionDrawer: le, HeaderWrapper: ue, LoadingWrapper: pe, SaveAsTemplateDrawer: fe, UnsubscribeWrapper: ve };
|
|
130
|
+
hasChanges: m,
|
|
131
|
+
saveSilent: D
|
|
132
|
+
}), { __sfc: !0, PreviewContainer: q, OnboardingWrapper: K, headerWrapperRef: E, wrapperRef: u, dynamicContentStore: p, unsubscribeStore: w, props: g, configStore: i, editorStore: f, previewStore: V, hasChanges: m, isTestPartner: j, saveSilent: D, templateId: v, userId: C, partnerName: T, username: k, templateConfig: o, editorConfig: s, html: d, css: F, preselectedDynamicContentList: y, savedModulesFolderName: L, defaultModulesFolderName: U, emit: n, metadata: S, options: _, initPlugin: M, getDefaultTemplate: O, cloneTimersOnSave: P, hasTimerBlocks: R, noHeader: J, insertDynamicContent: A, closeDynamicContent: B, handleDynamicContentOpen: h, ribbonObserver: c, updateRibbonOffset: b, AutoSaveController: ie, Toaster: me, FilterSelectionDrawer: de, HeaderWrapper: le, LoadingWrapper: ue, SaveAsTemplateDrawer: pe, UnsubscribeWrapper: fe };
|
|
136
133
|
}
|
|
137
134
|
});
|
|
138
135
|
export {
|
|
139
|
-
|
|
136
|
+
Ke as default
|
|
140
137
|
};
|
|
@@ -17,7 +17,7 @@ import K from "./MigrationConfirmModal.vue.js";
|
|
|
17
17
|
const ut = /* @__PURE__ */ O({
|
|
18
18
|
__name: "EditorActions",
|
|
19
19
|
setup(N, { expose: x }) {
|
|
20
|
-
const { config: a, isFeatureEnabled: l } = b(), { exportHtml: m } = k(), { save: u } = F(), { openVersionHistory: c, closeVersionHistory: p } = R(), { getCompiledEmail: f } = q(), { compileHtml: d } = D(), { validateLiquidSyntax: v } = z(), e = I(), y = P(), { hasMigrations:
|
|
20
|
+
const { config: a, isFeatureEnabled: l } = b(), { exportHtml: m } = k(), { save: u } = F(), { openVersionHistory: c, closeVersionHistory: p } = R(), { getCompiledEmail: f } = q(), { compileHtml: d } = D(), { validateLiquidSyntax: v } = z(), e = I(), y = P(), { hasMigrations: S } = J(y), s = L(), i = n(!1), r = n(!1), g = n(), H = B(), T = () => {
|
|
21
21
|
if (e.isVersionHistoryOpen) {
|
|
22
22
|
p();
|
|
23
23
|
return;
|
|
@@ -33,13 +33,13 @@ const ut = /* @__PURE__ */ O({
|
|
|
33
33
|
return ((o = (t = a.value) == null ? void 0 : t.features) == null ? void 0 : o.versionHistory) && !e.isPreviewModeOpen;
|
|
34
34
|
}
|
|
35
35
|
), V = async (t) => {
|
|
36
|
-
r.value = !0,
|
|
36
|
+
r.value = !0, e.loadingStatus = !0;
|
|
37
37
|
const o = await u(t);
|
|
38
|
-
return r.value = !1,
|
|
38
|
+
return r.value = !1, (t || !o) && (e.loadingStatus = !1), o;
|
|
39
39
|
}, E = (t) => {
|
|
40
40
|
var o;
|
|
41
|
-
if (!t &&
|
|
42
|
-
(o =
|
|
41
|
+
if (!t && S.value) {
|
|
42
|
+
(o = g.value) == null || o.open();
|
|
43
43
|
return;
|
|
44
44
|
}
|
|
45
45
|
return V(t);
|
|
@@ -58,7 +58,7 @@ const ut = /* @__PURE__ */ O({
|
|
|
58
58
|
};
|
|
59
59
|
return x({
|
|
60
60
|
handleSave: E
|
|
61
|
-
}), { __sfc: !0, config: a, isFeatureEnabled: l, exportHtml: m, save: u, openVersionHistory: c, closeVersionHistory: p, getCompiledEmail: f, compileHtml: d, validateLiquidSyntax: v, editorStore: e, templateStore: y, hasMigrations:
|
|
61
|
+
}), { __sfc: !0, config: a, isFeatureEnabled: l, exportHtml: m, save: u, openVersionHistory: c, closeVersionHistory: p, getCompiledEmail: f, compileHtml: d, validateLiquidSyntax: v, editorStore: e, templateStore: y, hasMigrations: S, trans: s, isExporting: i, isSaving: r, migrationModalRef: g, testEmailClick: H, handleVersionHistory: T, handleExport: w, handleSaveAs: _, versionHistoryTooltipText: C, isVersionHistoryButtonVisible: A, executeSave: V, handleSave: E, handleTestEmail: M, getTooltipOptions: j, InButtonV2: G, MigrationConfirmModal: K };
|
|
62
62
|
}
|
|
63
63
|
});
|
|
64
64
|
export {
|
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import { defineComponent as l, computed as
|
|
1
|
+
import { defineComponent as l, computed as d, ref as p } from "vue";
|
|
2
2
|
import { useConfig as k } from "../../../composables/useConfig.js";
|
|
3
3
|
import { useBack as B } from "../../../composables/useGuidoActions.js";
|
|
4
4
|
import { usePreviewMode as b } from "../../../composables/usePreviewMode.js";
|
|
5
5
|
import { useTranslations as v } from "../../../composables/useTranslations.js";
|
|
6
6
|
import { useVersionHistoryApi as _ } from "../../../composables/useVersionHistoryApi.js";
|
|
7
7
|
import { useEditorStore as V } from "../../../stores/editor.js";
|
|
8
|
-
import { InButtonV2 as
|
|
9
|
-
import { useDebounceFn as
|
|
8
|
+
import { InButtonV2 as g } from "@useinsider/design-system-vue";
|
|
9
|
+
import { useDebounceFn as w } from "../../../node_modules/@vueuse/shared/index.js";
|
|
10
10
|
const D = /* @__PURE__ */ l({
|
|
11
11
|
__name: "LeftSlot",
|
|
12
|
-
setup(
|
|
13
|
-
const e = V(), i = B(), { closeVersionHistory: n } = _(), { closePreviewMode: s } = b(), o = v(), { config: t } = k(), f =
|
|
12
|
+
setup(y) {
|
|
13
|
+
const e = V(), i = B(), { closeVersionHistory: n } = _(), { closePreviewMode: s } = b(), o = v(), { config: t } = k(), f = d(() => {
|
|
14
14
|
var u, m;
|
|
15
15
|
return e.isVersionHistoryOpen || e.isPreviewModeOpen ? o("email-editor.back-to-editor") : (m = (u = t.value) == null ? void 0 : u.ui) != null && m.backButtonLabel ? t.value.ui.backButtonLabel : o("email-editor.back-to-design");
|
|
16
|
-
}), r =
|
|
16
|
+
}), r = p(!1), c = () => {
|
|
17
17
|
if (e.isVersionHistoryOpen) {
|
|
18
18
|
n();
|
|
19
19
|
return;
|
|
@@ -22,13 +22,13 @@ const D = /* @__PURE__ */ l({
|
|
|
22
22
|
s();
|
|
23
23
|
return;
|
|
24
24
|
}
|
|
25
|
-
i();
|
|
26
|
-
}, a =
|
|
25
|
+
e.loadingStatus = !0, i();
|
|
26
|
+
}, a = w(() => {
|
|
27
27
|
c(), r.value = !1;
|
|
28
28
|
}, 500);
|
|
29
29
|
return { __sfc: !0, editorStore: e, handleBack: i, closeVersionHistory: n, closePreviewMode: s, trans: o, config: t, backButtonLabel: f, isBackButtonDisabled: r, executeBackAction: c, debouncedBackAction: a, handleBackClick: () => {
|
|
30
30
|
r.value = !0, a();
|
|
31
|
-
}, InButtonV2:
|
|
31
|
+
}, InButtonV2: g };
|
|
32
32
|
}
|
|
33
33
|
});
|
|
34
34
|
export {
|
|
@@ -1,21 +1,22 @@
|
|
|
1
|
-
import { getRecommendationFeedSourceMaps as I, URLS as
|
|
2
|
-
import { MinDeviceViewport as
|
|
3
|
-
import { useRecommendationExtensionStore as
|
|
1
|
+
import { getRecommendationFeedSourceMaps as I, URLS as R } from "../enums/extensions/recommendationBlock.js";
|
|
2
|
+
import { MinDeviceViewport as C, DefaultPadding as b } from "../enums/recommendation.js";
|
|
3
|
+
import { useRecommendationExtensionStore as l } from "../extensions/Blocks/Recommendation/store/recommendation.js";
|
|
4
4
|
import { generateCompleteFilterQuery as h } from "../extensions/Blocks/Recommendation/utils/filterUtil.js";
|
|
5
|
+
import { getPartnerRecommendationParams as y } from "../extensions/Blocks/Recommendation/utils/partnerCustomizations.js";
|
|
5
6
|
import { useConfigStore as x } from "../stores/config.js";
|
|
6
|
-
const
|
|
7
|
+
const k = () => ({
|
|
7
8
|
calculateCardWidth: ({
|
|
8
|
-
mobileLeftPadding:
|
|
9
|
+
mobileLeftPadding: a,
|
|
9
10
|
mobileRightPadding: s,
|
|
10
|
-
cardsInRow:
|
|
11
|
-
unresponsive:
|
|
11
|
+
cardsInRow: c,
|
|
12
|
+
unresponsive: o
|
|
12
13
|
}) => {
|
|
13
|
-
const r =
|
|
14
|
-
return (
|
|
14
|
+
const r = o ? c : 1, e = a + s + (r - 1) * b;
|
|
15
|
+
return (C - e) / r;
|
|
15
16
|
},
|
|
16
|
-
getRecommendationCampaignData: (
|
|
17
|
-
const s =
|
|
18
|
-
if (!
|
|
17
|
+
getRecommendationCampaignData: (a) => {
|
|
18
|
+
const s = l(), c = Number(a), o = s.blockStates[c];
|
|
19
|
+
if (!o)
|
|
19
20
|
return {
|
|
20
21
|
textTrimming: !1,
|
|
21
22
|
orientation: "vertical",
|
|
@@ -28,7 +29,7 @@ const w = () => ({
|
|
|
28
29
|
discountBeforeTextValue: "",
|
|
29
30
|
discountAfterTextValue: ""
|
|
30
31
|
};
|
|
31
|
-
const { recommendationConfigs: r } =
|
|
32
|
+
const { recommendationConfigs: r } = o, e = r.orientation === "grid" ? "vertical" : "horizontal";
|
|
32
33
|
return {
|
|
33
34
|
textTrimming: r.textTrimming,
|
|
34
35
|
orientation: e,
|
|
@@ -42,35 +43,35 @@ const w = () => ({
|
|
|
42
43
|
discountAfterTextValue: ""
|
|
43
44
|
};
|
|
44
45
|
},
|
|
45
|
-
buildCampaignUrl: (
|
|
46
|
-
var
|
|
47
|
-
const
|
|
46
|
+
buildCampaignUrl: (a, s) => {
|
|
47
|
+
var m;
|
|
48
|
+
const c = l(), o = x(), r = Number(a);
|
|
48
49
|
let e;
|
|
49
50
|
if (s)
|
|
50
51
|
e = s;
|
|
51
52
|
else {
|
|
52
|
-
const
|
|
53
|
-
if (!
|
|
53
|
+
const i = c.blockStates[r];
|
|
54
|
+
if (!i)
|
|
54
55
|
return "";
|
|
55
|
-
const { recommendationConfigs:
|
|
56
|
+
const { recommendationConfigs: n } = i;
|
|
56
57
|
e = {
|
|
57
|
-
strategy:
|
|
58
|
-
language:
|
|
59
|
-
currencyCode:
|
|
60
|
-
size:
|
|
61
|
-
productIds:
|
|
62
|
-
filters:
|
|
63
|
-
shuffleProducts:
|
|
58
|
+
strategy: n.strategy,
|
|
59
|
+
language: n.language,
|
|
60
|
+
currencyCode: n.currencySettings.value,
|
|
61
|
+
size: n.size,
|
|
62
|
+
productIds: n.productIds,
|
|
63
|
+
filters: n.filters,
|
|
64
|
+
shuffleProducts: n.shuffleProducts
|
|
64
65
|
};
|
|
65
66
|
}
|
|
66
|
-
const f = ((
|
|
67
|
-
t.set("locale", e.language), t.set("currency", e.currencyCode), t.set("partnerName",
|
|
68
|
-
const g = e.filters.filter((
|
|
69
|
-
d && t.set("filter", d), e.shuffleProducts && t.set("shuffle", "true");
|
|
70
|
-
const p = decodeURIComponent(t.toString()), u = `${
|
|
71
|
-
return
|
|
67
|
+
const f = ((m = I().find((i) => i.key === e.strategy)) == null ? void 0 : m.path) || "", t = new URLSearchParams();
|
|
68
|
+
t.set("locale", e.language), t.set("currency", e.currencyCode), t.set("partnerName", o.partnerName), t.set("size", e.size), t.set("details", "true"), t.set("campaignId", o.variationId), e.strategy === "manualMerchandising" ? t.set("productId", e.productIds.join(",")) : e.strategy === "similarViewed" && t.set("productId", "{itemId}"), e.strategy === "userBased" && t.set("userId", "{user_id}");
|
|
69
|
+
const g = e.filters.filter((i) => i.isValid), d = h(g);
|
|
70
|
+
d && t.set("filter", d), e.shuffleProducts && t.set("shuffle", "true"), Object.entries(y(o.partnerName, e.strategy)).forEach(([i, n]) => t.set(i, n));
|
|
71
|
+
const p = decodeURIComponent(t.toString()), u = `${R.RECOMMENDATION_API_URL}/v2/${f}?${p}`;
|
|
72
|
+
return c.recommendationCampaignUrls[a] = u, u;
|
|
72
73
|
}
|
|
73
74
|
});
|
|
74
75
|
export {
|
|
75
|
-
|
|
76
|
+
k as useRecommendation
|
|
76
77
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
var C = Object.defineProperty;
|
|
2
|
-
var p = (d,
|
|
3
|
-
var s = (d,
|
|
2
|
+
var p = (d, l, t) => l in d ? C(d, l, { enumerable: !0, configurable: !0, writable: !0, value: t }) : d[l] = t;
|
|
3
|
+
var s = (d, l, t) => p(d, typeof l != "symbol" ? l + "" : l, t);
|
|
4
4
|
import { CommonControl as g } from "../../../common-control.js";
|
|
5
5
|
import { DEFAULT_NODE_CONFIG as a } from "../../constants/defaultConfig.js";
|
|
6
6
|
import { RecommendationConfigService as h } from "../../services/configService.js";
|
|
@@ -18,11 +18,11 @@ import { LOCALE_CONTROL_ID as it } from "./locale.js";
|
|
|
18
18
|
import { ProductCountControl as I } from "./productCount.js";
|
|
19
19
|
import { PRODUCT_COUNT_CONTROL_ID as at } from "./productCount.js";
|
|
20
20
|
import { ProductLayoutControl as T } from "./productLayout.js";
|
|
21
|
-
import { PRODUCT_LAYOUT_CONTROL_ID as
|
|
21
|
+
import { PRODUCT_LAYOUT_CONTROL_ID as ct } from "./productLayout.js";
|
|
22
22
|
import { ShuffleControl as S } from "./shuffle.js";
|
|
23
23
|
import { SHUFFLE_CONTROL_ID as dt } from "./shuffle.js";
|
|
24
24
|
import { setCurrencyAttributes as L, getBlockElement as P, updateProductContentInPlace as D, regenerateProductRowsWithStyles as k } from "./utils.js";
|
|
25
|
-
import { adjustProductsToSize as mt, formatProductPrice as ft, getCardComposition as Ct, getCurrentLayout as pt,
|
|
25
|
+
import { adjustProductsToSize as mt, formatProductPrice as ft, getCardComposition as Ct, getCurrentLayout as pt, regenerateMobileProductRows as gt, updatePricesInPlace as yt, updateSingleProductContent as Nt } from "./utils.js";
|
|
26
26
|
import { useDebounceFn as m } from "../../../../../node_modules/@vueuse/shared/index.js";
|
|
27
27
|
const E = "recommendation-id", v = "ui-elements-recommendation-block";
|
|
28
28
|
class K extends g {
|
|
@@ -320,8 +320,8 @@ class K extends g {
|
|
|
320
320
|
}
|
|
321
321
|
const i = t.$state.configVersion;
|
|
322
322
|
i !== o && (o = i, this._persistFiltersToNodeConfig(), this._debouncedFetchProducts());
|
|
323
|
-
const
|
|
324
|
-
u && f && (e =
|
|
323
|
+
const c = t.recommendationProducts, u = c !== e, f = Array.isArray(c) && c.length > 0;
|
|
324
|
+
u && f && (e = c, this._debouncedRegenerateWithProducts());
|
|
325
325
|
});
|
|
326
326
|
}
|
|
327
327
|
/**
|
|
@@ -353,7 +353,7 @@ export {
|
|
|
353
353
|
b as LayoutOrientationControl,
|
|
354
354
|
O as LocaleControl,
|
|
355
355
|
at as PRODUCT_COUNT_CONTROL_ID,
|
|
356
|
-
|
|
356
|
+
ct as PRODUCT_LAYOUT_CONTROL_ID,
|
|
357
357
|
I as ProductCountControl,
|
|
358
358
|
T as ProductLayoutControl,
|
|
359
359
|
K as RecommendationBlockControl,
|
|
@@ -364,12 +364,10 @@ export {
|
|
|
364
364
|
P as getBlockElement,
|
|
365
365
|
Ct as getCardComposition,
|
|
366
366
|
pt as getCurrentLayout,
|
|
367
|
-
gt as
|
|
368
|
-
yt as regenerateMobileProductRows,
|
|
369
|
-
Nt as regenerateProductRows,
|
|
367
|
+
gt as regenerateMobileProductRows,
|
|
370
368
|
k as regenerateProductRowsWithStyles,
|
|
371
369
|
L as setCurrencyAttributes,
|
|
372
|
-
|
|
370
|
+
yt as updatePricesInPlace,
|
|
373
371
|
D as updateProductContentInPlace,
|
|
374
|
-
|
|
372
|
+
Nt as updateSingleProductContent
|
|
375
373
|
};
|
|
@@ -1,61 +1,53 @@
|
|
|
1
|
-
var
|
|
2
|
-
var p = (
|
|
3
|
-
var r = (
|
|
4
|
-
import { ModificationDescription as
|
|
5
|
-
import { CommonControl as
|
|
6
|
-
import { ATTR_DATA_CUSTOM_ATTRIBUTES as
|
|
7
|
-
import { LAYOUT_OPTIONS as
|
|
1
|
+
var A = Object.defineProperty;
|
|
2
|
+
var p = (e, o, t) => o in e ? A(e, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[o] = t;
|
|
3
|
+
var r = (e, o, t) => p(e, typeof o != "symbol" ? o + "" : o, t);
|
|
4
|
+
import { ModificationDescription as O } from "../../../../../node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js";
|
|
5
|
+
import { CommonControl as L } from "../../../common-control.js";
|
|
6
|
+
import { ATTR_DATA_CUSTOM_ATTRIBUTES as T } from "../../constants/selectors.js";
|
|
7
|
+
import { LAYOUT_OPTIONS as h, DEFAULT_MOBILE_ROW_SPACING as m, DEFAULT_MOBILE_COLUMN_SPACING as d, DEFAULT_ROW_SPACING as l, DEFAULT_COLUMN_SPACING as C } from "../../constants/layout.js";
|
|
8
8
|
import { DEFAULT_COMPOSITION as _ } from "../../constants/defaultConfig.js";
|
|
9
9
|
import { RecommendationConfigService as s } from "../../services/configService.js";
|
|
10
|
-
import { useRecommendationExtensionStore as
|
|
11
|
-
import { getCurrentLayout as
|
|
12
|
-
const
|
|
10
|
+
import { useRecommendationExtensionStore as N } from "../../store/recommendation.js";
|
|
11
|
+
import { getCurrentLayout as g, getBlockElement as f, regenerateProductRowsWithStyles as S } from "./utils.js";
|
|
12
|
+
const I = "recommendation-layout-orientation-control", a = {
|
|
13
13
|
LAYOUT: "layout"
|
|
14
|
-
},
|
|
14
|
+
}, U = "data-card-composition", n = {
|
|
15
15
|
LAYOUT: "data-layout",
|
|
16
16
|
COLUMN_SPACING: "data-column-spacing",
|
|
17
17
|
ROW_SPACING: "data-row-spacing",
|
|
18
18
|
MOBILE_COLUMN_SPACING: "data-mobile-column-spacing",
|
|
19
19
|
MOBILE_ROW_SPACING: "data-mobile-row-spacing"
|
|
20
20
|
};
|
|
21
|
-
class
|
|
21
|
+
class w extends L {
|
|
22
22
|
constructor() {
|
|
23
23
|
super(...arguments);
|
|
24
|
-
r(this, "store",
|
|
24
|
+
r(this, "store", N());
|
|
25
25
|
r(this, "isChangingLayout", !1);
|
|
26
26
|
}
|
|
27
27
|
getId() {
|
|
28
|
-
return
|
|
28
|
+
return I;
|
|
29
29
|
}
|
|
30
30
|
getTemplate() {
|
|
31
31
|
return `
|
|
32
32
|
<div class="layout-control-container">
|
|
33
|
-
${this._GuOnPageMessage({ name: A })}
|
|
34
|
-
|
|
35
33
|
${this._GuTwoColumns([
|
|
36
34
|
this._GuLabel({ text: this.api.translate("Layout Orientation") }),
|
|
37
35
|
this._GuRadioButton({
|
|
38
36
|
name: a.LAYOUT,
|
|
39
|
-
buttons:
|
|
37
|
+
buttons: h
|
|
40
38
|
})
|
|
41
39
|
])}
|
|
42
40
|
</div>
|
|
43
41
|
`;
|
|
44
42
|
}
|
|
45
43
|
onRender() {
|
|
46
|
-
this.
|
|
47
|
-
A,
|
|
48
|
-
this.api.translate(
|
|
49
|
-
`Note that updating the Layout Orientation, Number of Products and
|
|
50
|
-
Products in One Row settings resets the style of your Recommendation block.`
|
|
51
|
-
)
|
|
52
|
-
), this._setFormValues(), this._listenToFormUpdates();
|
|
44
|
+
this._setFormValues(), this._listenToFormUpdates();
|
|
53
45
|
}
|
|
54
46
|
onTemplateNodeUpdated(t) {
|
|
55
47
|
super.onTemplateNodeUpdated(t), this._setFormValues();
|
|
56
48
|
}
|
|
57
49
|
_setFormValues() {
|
|
58
|
-
const u = s.getConfig(this.currentNode).layout ||
|
|
50
|
+
const u = s.getConfig(this.currentNode).layout || g(this.currentNode);
|
|
59
51
|
this.api.updateValues({
|
|
60
52
|
[a.LAYOUT]: u
|
|
61
53
|
});
|
|
@@ -65,9 +57,9 @@ class Y extends N {
|
|
|
65
57
|
* Updates node config, data attribute and regenerates product rows
|
|
66
58
|
*/
|
|
67
59
|
_onLayoutChange(t) {
|
|
68
|
-
if (this.isChangingLayout || !this.currentNode || (s.getConfig(this.currentNode).layout ||
|
|
60
|
+
if (this.isChangingLayout || !this.currentNode || (s.getConfig(this.currentNode).layout || g(this.currentNode)) === t)
|
|
69
61
|
return;
|
|
70
|
-
const c =
|
|
62
|
+
const c = f(this.currentNode);
|
|
71
63
|
if (c) {
|
|
72
64
|
this.isChangingLayout = !0;
|
|
73
65
|
try {
|
|
@@ -76,15 +68,15 @@ class Y extends N {
|
|
|
76
68
|
this.currentNode,
|
|
77
69
|
{
|
|
78
70
|
layout: t,
|
|
79
|
-
columnSpacing:
|
|
71
|
+
columnSpacing: C,
|
|
80
72
|
rowSpacing: l,
|
|
81
73
|
mobileColumnSpacing: d,
|
|
82
74
|
mobileRowSpacing: m
|
|
83
75
|
},
|
|
84
76
|
`Changed layout to ${t}`
|
|
85
77
|
), this.store.patchCurrentBlockConfig({ orientation: t });
|
|
86
|
-
const
|
|
87
|
-
t === "list" ? (
|
|
78
|
+
const i = this.api.getDocumentModifier().modifyHtml(c).setAttribute(n.LAYOUT, t).setAttribute(n.COLUMN_SPACING, C.toString()).setAttribute(n.ROW_SPACING, l.toString()).setAttribute(n.MOBILE_COLUMN_SPACING, d.toString()).setAttribute(n.MOBILE_ROW_SPACING, m.toString());
|
|
79
|
+
t === "list" ? (i.setClass("es-m-p0"), i.setClass("ins-recommendation-list-layout")) : (i.removeClass("es-m-p0"), i.removeClass("ins-recommendation-list-layout")), i.setAttribute(U, _.join(",")).setAttribute(T, "[]"), i.apply(new O(`Update layout to ${t}`)), this._regenerateProductRows(t);
|
|
88
80
|
} finally {
|
|
89
81
|
this.isChangingLayout = !1;
|
|
90
82
|
}
|
|
@@ -110,6 +102,6 @@ class Y extends N {
|
|
|
110
102
|
}
|
|
111
103
|
}
|
|
112
104
|
export {
|
|
113
|
-
|
|
114
|
-
|
|
105
|
+
I as LAYOUT_ORIENTATION_CONTROL_ID,
|
|
106
|
+
w as LayoutOrientationControl
|
|
115
107
|
};
|