@useinsider/guido 3.20.1 → 3.21.0

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 (56) hide show
  1. package/dist/components/Guido.vue.js +1 -1
  2. package/dist/components/Guido.vue2.js +65 -64
  3. package/dist/components/organisms/AutoSaveController.vue2.js +10 -9
  4. package/dist/components/organisms/header/EditorActions.vue.js +4 -4
  5. package/dist/components/organisms/header/EditorActions.vue2.js +53 -51
  6. package/dist/components/organisms/validation/ValidationErrorDrawer.vue.js +3 -3
  7. package/dist/components/organisms/validation/ValidationErrorDrawer.vue2.js +23 -22
  8. package/dist/composables/useAutoSave.js +46 -44
  9. package/dist/composables/useLegacyStrategyConversion.js +16 -16
  10. package/dist/composables/useSave.js +26 -23
  11. package/dist/composables/useSaveValidation.js +113 -114
  12. package/dist/composables/useSaveValidationRollout.js +17 -6
  13. package/dist/composables/useStripo.js +4 -3
  14. package/dist/extensions/Blocks/Items/block.js +43 -42
  15. package/dist/extensions/Blocks/Recommendation/controls/main/index.js +296 -223
  16. package/dist/extensions/Blocks/Recommendation/store/recommendation.js +221 -203
  17. package/dist/extensions/Blocks/Recommendation/utils/blockRefresh.js +19 -0
  18. package/dist/extensions/Blocks/Recommendation/utils/nodeConfigWriter.js +51 -36
  19. package/dist/extensions/Blocks/Recommendation/utils/strategyCommit.js +31 -35
  20. package/dist/extensions/Blocks/Unsubscribe/block.js +70 -75
  21. package/dist/guido.css +1 -1
  22. package/dist/node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js +271 -192
  23. package/dist/package.json.js +1 -1
  24. package/dist/services/settingsApi.js +11 -0
  25. package/dist/src/components/Guido.vue.d.ts +1 -1
  26. package/dist/src/components/organisms/header/EditorActions.vue.d.ts +1 -1
  27. package/dist/src/components/organisms/header/HeaderWrapper.vue.d.ts +1 -1
  28. package/dist/src/components/organisms/header/RightSlot.vue.d.ts +1 -1
  29. package/dist/src/composables/useAutoSave.d.ts +4 -1
  30. package/dist/src/composables/useSaveValidationRollout.d.ts +1 -0
  31. package/dist/src/extensions/Blocks/Checkbox/controls/blockBackground/index.d.ts +1 -0
  32. package/dist/src/extensions/Blocks/CouponBlock/controls/index.d.ts +8 -0
  33. package/dist/src/extensions/Blocks/Items/controls/index.d.ts +40 -0
  34. package/dist/src/extensions/Blocks/RadioButton/controls/blockBackground/index.d.ts +1 -0
  35. package/dist/src/extensions/Blocks/Recommendation/controls/blockBackground/index.d.ts +1 -0
  36. package/dist/src/extensions/Blocks/Recommendation/controls/button/index.d.ts +11 -0
  37. package/dist/src/extensions/Blocks/Recommendation/controls/customAttribute/index.d.ts +7 -0
  38. package/dist/src/extensions/Blocks/Recommendation/controls/image/index.d.ts +2 -0
  39. package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +18 -3
  40. package/dist/src/extensions/Blocks/Recommendation/controls/name/index.d.ts +7 -0
  41. package/dist/src/extensions/Blocks/Recommendation/controls/oldPrice/index.d.ts +7 -0
  42. package/dist/src/extensions/Blocks/Recommendation/controls/omnibusDiscount/index.d.ts +7 -0
  43. package/dist/src/extensions/Blocks/Recommendation/controls/omnibusPrice/index.d.ts +7 -0
  44. package/dist/src/extensions/Blocks/Recommendation/controls/price/index.d.ts +7 -0
  45. package/dist/src/extensions/Blocks/Recommendation/controls/title/index.d.ts +7 -0
  46. package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +9 -1
  47. package/dist/src/extensions/Blocks/Recommendation/utils/blockRefresh.d.ts +17 -0
  48. package/dist/src/extensions/Blocks/Recommendation/utils/nodeConfigWriter.d.ts +7 -0
  49. package/dist/src/extensions/Blocks/Unsubscribe/block.d.ts +1 -6
  50. package/dist/src/extensions/Blocks/_Boilerplate/controls/blockBackground/index.d.ts +1 -0
  51. package/dist/src/extensions/Blocks/controlFactories.d.ts +22 -0
  52. package/dist/src/services/settingsApi.d.ts +6 -0
  53. package/dist/src/stores/setup-settings.d.ts +4 -0
  54. package/dist/static/styles/components/button.css.js +5 -0
  55. package/dist/stores/setup-settings.js +10 -0
  56. package/package.json +4 -4
@@ -1,76 +1,78 @@
1
- import { useConfig as E } from "./useConfig.js";
2
- import { useEditorLock as f } from "./useEditorLock.js";
3
- import { useAutosaveStore as p, AUTOSAVE_STATUS as s } from "../stores/autosave.js";
4
- import { useEditorStore as A } from "../stores/editor.js";
5
- import { computed as y, watch as I, onUnmounted as L } from "vue";
6
- const w = 18e4, v = 6e4, R = (b) => {
7
- const { isFeatureEnabled: S } = E(), o = A(), t = p(), { isEditorBusy: g } = f();
8
- let i = null, c = 0;
9
- const u = y(
10
- () => S("autosave") && t.isOn
11
- ), m = () => o.hasChanges && o.isInSaveableState, h = () => ({
12
- hasChanges: o.hasChanges,
13
- isInSaveableState: o.isInSaveableState
14
- }), l = async (e) => {
15
- if (!u.value) {
1
+ import { useConfig as p } from "./useConfig.js";
2
+ import { useEditorLock as y } from "./useEditorLock.js";
3
+ import { useAutosaveStore as I, AUTOSAVE_STATUS as a } from "../stores/autosave.js";
4
+ import { useEditorStore as L } from "../stores/editor.js";
5
+ import { computed as w, watch as V, onUnmounted as k } from "vue";
6
+ const D = 18e4, b = 6e4, _ = (g, { clearsChanges: h = () => !0 } = {}) => {
7
+ const { isFeatureEnabled: m } = p(), s = L(), t = I(), { isEditorBusy: f } = y();
8
+ let o = null, l = 0, u = -1;
9
+ const d = w(
10
+ () => m("autosave") && t.isOn
11
+ ), A = () => s.hasChanges && s.isInSaveableState && s.changeSeq !== u, E = () => ({
12
+ hasChanges: s.hasChanges,
13
+ isInSaveableState: s.isInSaveableState,
14
+ isUnchangedSinceLastSave: s.changeSeq === u
15
+ }), r = async (e) => {
16
+ if (!d.value) {
16
17
  console.debug("guido:autosave:skipped", { trigger: e, reason: "not-active" });
17
18
  return;
18
19
  }
19
- if (!m()) {
20
- console.debug("guido:autosave:skipped", { trigger: e, reason: "gates-blocked", gates: h() });
20
+ if (!A()) {
21
+ console.debug("guido:autosave:skipped", { trigger: e, reason: "gates-blocked", gates: E() });
21
22
  return;
22
23
  }
23
- if (t.status === s.SAVING) {
24
+ if (t.status === a.SAVING) {
24
25
  console.debug("guido:autosave:skipped", { trigger: e, reason: "already-saving" });
25
26
  return;
26
27
  }
27
- if (g()) {
28
+ if (f()) {
28
29
  console.debug("guido:autosave:skipped", { trigger: e, reason: "editor-busy" });
29
30
  return;
30
31
  }
31
- e === "visibility" && (c = Date.now()), console.debug("guido:autosave:save-start", { trigger: e }), t.status = s.SAVING;
32
+ e === "visibility" && (l = Date.now()), console.debug("guido:autosave:save-start", { trigger: e }), t.status = a.SAVING;
33
+ const n = s.changeSeq;
32
34
  try {
33
- if (await b() === void 0) {
34
- console.debug("guido:autosave:blocked", { trigger: e, reason: "save-returned-undefined" }), t.status = s.ERROR;
35
+ if (await g() === void 0) {
36
+ console.debug("guido:autosave:blocked", { trigger: e, reason: "save-returned-undefined" }), t.status = a.ERROR;
35
37
  return;
36
38
  }
37
- o.hasChanges = !1, t.status = s.SAVED, t.lastSavedAt = /* @__PURE__ */ new Date(), console.debug("guido:autosave:save-complete", { trigger: e, at: t.lastSavedAt });
38
- } catch (a) {
39
- console.debug("guido:autosave:error", { trigger: e, error: a }), t.status = s.ERROR;
39
+ u = n, h() && (s.hasChanges = !1), t.status = a.SAVED, t.lastSavedAt = /* @__PURE__ */ new Date(), console.debug("guido:autosave:save-complete", { trigger: e, at: t.lastSavedAt });
40
+ } catch (S) {
41
+ console.debug("guido:autosave:error", { trigger: e, error: S }), t.status = a.ERROR;
40
42
  }
41
- }, n = () => {
43
+ }, i = () => {
42
44
  const { visibilityState: e } = document;
43
45
  if (console.debug("guido:autosave:visibility-change", {
44
46
  visibilityState: e,
45
- isActive: u.value
47
+ isActive: d.value
46
48
  }), e !== "hidden")
47
49
  return;
48
- const a = Date.now() - c;
49
- if (a < v) {
50
+ const n = Date.now() - l;
51
+ if (n < b) {
50
52
  console.debug("guido:autosave:visibility-debounced", {
51
- sinceLastMs: a,
52
- debounceMs: v
53
+ sinceLastMs: n,
54
+ debounceMs: b
53
55
  });
54
56
  return;
55
57
  }
56
- l("visibility");
57
- }, d = () => {
58
- i && (clearInterval(i), i = null);
59
- }, r = () => {
60
- document.removeEventListener("visibilitychange", n), window.removeEventListener("pagehide", n);
58
+ r("visibility");
59
+ }, c = () => {
60
+ o && (clearInterval(o), o = null);
61
+ }, v = () => {
62
+ document.removeEventListener("visibilitychange", i), window.removeEventListener("pagehide", i);
61
63
  };
62
- I(
63
- u,
64
+ V(
65
+ d,
64
66
  (e) => {
65
- console.debug("guido:autosave:active-changed", { active: e }), e ? (d(), i = setInterval(() => {
66
- console.debug("guido:autosave:interval-tick"), l("interval");
67
- }, w), document.addEventListener("visibilitychange", n), window.addEventListener("pagehide", n)) : (d(), r(), t.status = s.IDLE);
67
+ console.debug("guido:autosave:active-changed", { active: e }), e ? (c(), o = setInterval(() => {
68
+ console.debug("guido:autosave:interval-tick"), r("interval");
69
+ }, D), document.addEventListener("visibilitychange", i), window.addEventListener("pagehide", i)) : (c(), v(), t.status = a.IDLE);
68
70
  },
69
71
  { immediate: !0 }
70
- ), L(() => {
71
- d(), r(), t.status = s.IDLE, t.lastSavedAt = null;
72
+ ), k(() => {
73
+ c(), v(), t.status = a.IDLE, t.lastSavedAt = null;
72
74
  });
73
75
  };
74
76
  export {
75
- R as useAutoSave
77
+ _ as useAutoSave
76
78
  };
@@ -1,34 +1,34 @@
1
- import { useRecommendation as C } from "./useRecommendation.js";
1
+ import { useRecommendation as S } from "./useRecommendation.js";
2
2
  import { useToaster as I } from "./useToaster.js";
3
3
  import { useTranslations as v } from "./useTranslations.js";
4
4
  import { ToasterTypeOptions as g } from "../enums/toaster.js";
5
5
  import "../extensions/Blocks/Recommendation/constants/selectors.js";
6
6
  import { CURRENT_CONFIG_VERSION as L } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
7
- import { useRecommendationExtensionStore as b } from "../extensions/Blocks/Recommendation/store/recommendation.js";
8
- import { resolveMigrationTarget as k, buildLegacyMigrationPayload as R } from "../extensions/Blocks/Recommendation/utils/legacyStrategyMigration.js";
7
+ import { useRecommendationExtensionStore as R } from "../extensions/Blocks/Recommendation/store/recommendation.js";
8
+ import { resolveMigrationTarget as b, buildLegacyMigrationPayload as k } from "../extensions/Blocks/Recommendation/utils/legacyStrategyMigration.js";
9
9
  import { commitBlockChangeOutsidePanel as T } from "../extensions/Blocks/Recommendation/utils/nodeConfigWriter.js";
10
10
  import { useConfigStore as h } from "../stores/config.js";
11
11
  const F = () => {
12
- const e = b(), r = h(), { buildCampaignUrl: m } = C(), { showToaster: c } = I(), a = v();
12
+ const e = R(), o = h(), { buildCampaignUrl: m } = S(), { showToaster: c } = I(), a = v();
13
13
  return { convertLegacyStrategy: async () => {
14
14
  const t = e.currentRecommendationId;
15
15
  if (t === null || !e.isLegacyStrategyBlock || e.legacyConversionLoading)
16
16
  return "";
17
- const { strategy: d, productIds: y, size: l, strategyId: p, nodeConfigVersion: u } = e.recommendationConfigs, f = { strategyId: p, size: l, nodeConfigVersion: u }, s = k({
18
- campaignId: r.campaignId,
19
- templateLibraryId: r.templateLibraryId
20
- }), S = R({
17
+ const { strategy: d, productIds: y, size: l, strategyId: p, nodeConfigVersion: u } = e.recommendationConfigs, f = { strategyId: p, size: l, nodeConfigVersion: u }, s = b({
18
+ campaignId: o.campaignId,
19
+ templateLibraryId: o.templateLibraryId
20
+ }), C = k({
21
21
  blockId: t,
22
22
  url: m(String(t)),
23
- campaignId: r.campaignId,
24
- variationId: r.variationId,
23
+ campaignId: o.campaignId,
24
+ variationId: o.variationId,
25
25
  strategy: d,
26
26
  productIds: y,
27
27
  target: s
28
28
  });
29
- let o;
29
+ let r;
30
30
  try {
31
- o = await e.convertLegacyStrategy(S, s);
31
+ r = await e.convertLegacyStrategy(C, s);
32
32
  } catch (i) {
33
33
  return console.error("[useLegacyStrategyConversion] migration failed", i), c({
34
34
  type: g.Error,
@@ -40,7 +40,7 @@ const F = () => {
40
40
  }), "";
41
41
  }
42
42
  try {
43
- await e.fetchStrategyProductsForBlock(t);
43
+ await e.fetchRecommendationProductsForBlock(t);
44
44
  } catch (i) {
45
45
  console.error("[useLegacyStrategyConversion] product refetch failed", i);
46
46
  }
@@ -48,16 +48,16 @@ const F = () => {
48
48
  return n ? T(
49
49
  t,
50
50
  {
51
- strategyId: o,
51
+ strategyId: r,
52
52
  size: n.recommendationConfigs.size,
53
53
  configVersion: L
54
54
  },
55
55
  n.recommendationProducts,
56
56
  "Converted legacy recommendation strategy"
57
- ) ? (e.currentRecommendationId === t && e.openLegacyStrategyUpdatedModal(), o) : (console.error("[useLegacyStrategyConversion] node write failed", t), e.revertLegacyConversion(t, f), c({
57
+ ) ? (e.currentRecommendationId === t && e.openLegacyStrategyUpdatedModal(), r) : (console.error("[useLegacyStrategyConversion] node write failed", t), e.revertLegacyConversion(t, f), c({
58
58
  type: g.Error,
59
59
  message: a("email-editor.legacy-strategy-update-failed")
60
- }), "") : o;
60
+ }), "") : r;
61
61
  } };
62
62
  };
63
63
  export {
@@ -1,4 +1,4 @@
1
- import { useActionsApi as W } from "./useActionsApi.js";
1
+ import { useActionsApi as R } from "./useActionsApi.js";
2
2
  import { useConfig as q } from "./useConfig.js";
3
3
  import { useEditorLock as O } from "./useEditorLock.js";
4
4
  import { useSaveStart as D, useSaveComplete as F } from "./useGuidoActions.js";
@@ -19,37 +19,37 @@ import { useLiquidValidator as et } from "./validators/useLiquidValidator.js";
19
19
  import { useSyncModuleBlockValidator as ot } from "./validators/useSyncModuleBlockValidator.js";
20
20
  import { useUnsubscribeBlockValidator as st } from "./validators/useUnsubscribeBlockValidator.js";
21
21
  const Bt = () => {
22
- const r = D(), f = F(), { validateHtml: p } = _(), { validateLiquidSyntax: v } = et(), { validateCouponBlockTags: y } = tt(), { validateUnsubscribeBlockUniqueness: S, validateUnsubscribeBlockHasTemplate: w } = st(), { validateSyncModuleBlocks: n } = ot(), { callbacks: a, isFeatureEnabled: m } = q(), { extractSyncModuleData: b } = G(), { setSyncModuleUnsubscriptionPages: g } = J(), { editorSave: E, getTemplateData: H } = W(), { showToaster: V } = $(), { getBlockedDomains: x, resolveToast: k } = Z(), { prepareTemplateDetails: d } = X(), { collectSaveValidationErrors: C } = j(), { isEnabled: B } = z(), T = Q(), h = N(), P = K(), { runExclusive: l } = O(), c = async (t, e, o) => {
23
- if (!m("allowlistEnabled"))
22
+ const a = D(), p = F(), { validateHtml: v } = _(), { validateLiquidSyntax: S } = et(), { validateCouponBlockTags: y } = tt(), { validateUnsubscribeBlockUniqueness: w, validateUnsubscribeBlockHasTemplate: E } = st(), { validateSyncModuleBlocks: n } = ot(), { callbacks: r, isFeatureEnabled: d } = q(), { extractSyncModuleData: b } = G(), { setSyncModuleUnsubscriptionPages: g } = J(), { editorSave: H, getTemplateData: V } = R(), { showToaster: x } = $(), { getBlockedDomains: k, resolveToast: C } = Z(), { prepareTemplateDetails: m } = X(), { collectSaveValidationErrors: B } = j(), { isEnabled: h } = z(), T = Q(), P = N(), f = K(), { runExclusive: l } = O(), c = async (t, e, o) => {
23
+ if (!d("allowlistEnabled"))
24
24
  return !1;
25
- const i = await x(t, e);
25
+ const i = await k(t, e);
26
26
  if (!i.length)
27
27
  return !1;
28
28
  if (!o) {
29
- const s = await k(i);
30
- s != null && s.message && V({
29
+ const s = await C(i);
30
+ s != null && s.message && x({
31
31
  type: I.Warning,
32
32
  message: s.message,
33
33
  actionButton: s.actionButton
34
34
  });
35
35
  }
36
36
  return !0;
37
- }, L = async (t) => !y(t.compiledHtml) || !S(t.compiledHtml) || !w(t.compiledHtml) ? !1 : m("liquidSyntax") ? v(t.compiledHtml) : p(t.compiledHtml, t.dynamicContentList, !0), u = async (t, e) => {
38
- if (!await E())
37
+ }, L = async (t) => !y(t.compiledHtml) || !w(t.compiledHtml) || !E(t.compiledHtml) ? !1 : d("liquidSyntax") ? S(t.compiledHtml) : v(t.compiledHtml, t.dynamicContentList, !0), u = async (t, e) => {
38
+ if (!await H())
39
39
  return;
40
40
  const { unsubscribePayload: i, stripoModules: s } = b(t.rawHtml);
41
41
  if (await g(i), t.modules = s, !e.suppress) {
42
- const R = e.blankCompiled ? { compiledHtml: "", ampHtml: "" } : {};
43
- f({ ...t, ...R, silent: e.silent });
42
+ const W = e.blankCompiled ? { compiledHtml: "", ampHtml: "" } : {};
43
+ p({ ...t, ...W, silent: e.silent });
44
44
  }
45
45
  return t;
46
46
  }, U = async (t, e) => {
47
47
  var i;
48
- r();
49
- const o = await d();
48
+ a();
49
+ const o = await m();
50
50
  if (n(o.rawHtml, e)) {
51
- if (B.value && !e) {
52
- const s = await C(
51
+ if (h.value && !e) {
52
+ const s = await B(
53
53
  o.compiledHtml,
54
54
  o.dynamicContentList
55
55
  );
@@ -59,31 +59,34 @@ const Bt = () => {
59
59
  }
60
60
  } else if (!await L(o))
61
61
  return;
62
- if (!((i = a.value) != null && i.externalValidation && !await a.value.externalValidation(o)) && !await c(o.compiledHtml, o.css, e))
62
+ if (!((i = r.value) != null && i.externalValidation && !await r.value.externalValidation(o)) && !await c(o.compiledHtml, o.css, e))
63
63
  return u(o, { silent: e, suppress: t });
64
64
  }
65
65
  }, A = async () => {
66
66
  var e;
67
- if (!P.allowSaveWithErrors)
67
+ if (!f.allowSaveWithErrors)
68
68
  return;
69
- r();
70
- const t = await d();
71
- if (n(t.rawHtml, !1) && !((e = a.value) != null && e.externalValidation && !await a.value.externalValidation(t)) && !await c(t.compiledHtml, t.css, !1))
69
+ a();
70
+ const t = await m();
71
+ if (n(t.rawHtml, !1) && !((e = r.value) != null && e.externalValidation && !await r.value.externalValidation(t)) && !await c(t.compiledHtml, t.css, !1))
72
72
  return u(t, { silent: !1, blankCompiled: !0 });
73
73
  }, M = async () => {
74
- r();
75
- const { html: t, css: e } = await H();
74
+ if (!f.allowSaveWithErrors)
75
+ return;
76
+ a();
77
+ const { html: t, css: e } = await V();
76
78
  if (!n(t, !0) || await c(t, e, !0))
77
79
  return;
78
80
  const o = Y(t), i = {
79
- dynamicContentList: h.getSelectedDynamicContentList,
81
+ dynamicContentList: P.getSelectedDynamicContentList,
80
82
  compiledHtml: "",
81
83
  rawHtml: t,
82
84
  css: e,
83
85
  ampHtml: "",
84
86
  ampErrors: [],
85
87
  modules: [],
86
- recommendation: { campaignUrls: {}, configs: {} },
88
+ // No campaignUrls: hosts overwrite their stored map with any object, and raw HTML can't rebuild it.
89
+ recommendation: { configs: {} },
87
90
  unsubscribe: {
88
91
  status: o.length > 0,
89
92
  config: o