@useinsider/guido 3.18.2-beta.fc246a7 → 3.18.2-beta.fc87f65

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 (57) hide show
  1. package/dist/components/Guido.vue.js +3 -3
  2. package/dist/components/Guido.vue2.js +30 -30
  3. package/dist/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue.js +13 -11
  4. package/dist/components/organisms/extensions/recommendation/AssignStrategyDrawer.vue2.js +76 -57
  5. package/dist/components/organisms/extensions/recommendation/RemoveStrategyModal.vue2.js +23 -37
  6. package/dist/components/organisms/onboarding/OnboardingWrapper.vue2.js +20 -18
  7. package/dist/components/organisms/onboarding/RecommendationStrategyOnboarding.vue.js +21 -0
  8. package/dist/components/organisms/onboarding/RecommendationStrategyOnboarding.vue2.js +47 -0
  9. package/dist/components/organisms/save-as-template/SaveAsTemplateDrawer.vue2.js +34 -34
  10. package/dist/composables/useCustomInterfaceAppearance.js +56 -46
  11. package/dist/composables/useHtmlValidator.js +87 -82
  12. package/dist/composables/useHttp.js +24 -22
  13. package/dist/composables/useRecommendation.js +40 -35
  14. package/dist/composables/useStripo.js +30 -30
  15. package/dist/config/migrator/itemsBlockMigrator.js +167 -257
  16. package/dist/enums/extensions/recommendationBlock.js +38 -31
  17. package/dist/extensions/Blocks/Items/controls/name/trimming.js +17 -18
  18. package/dist/extensions/Blocks/Items/controls/settingsControl.js +105 -114
  19. package/dist/extensions/Blocks/Items/enums/productEnums.js +9 -14
  20. package/dist/extensions/Blocks/Items/layouts/horizontal.html.js +9 -11
  21. package/dist/extensions/Blocks/Items/template.js +204 -219
  22. package/dist/extensions/Blocks/Recommendation/block.js +43 -39
  23. package/dist/extensions/Blocks/Recommendation/constants/defaultConfig.js +21 -20
  24. package/dist/extensions/Blocks/Recommendation/controls/main/index.js +40 -35
  25. package/dist/extensions/Blocks/Recommendation/controls/main/strategy.js +84 -52
  26. package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +74 -74
  27. package/dist/extensions/Blocks/Recommendation/store/recommendation.js +194 -91
  28. package/dist/extensions/Blocks/Recommendation/utils/nodeConfigWriter.js +26 -16
  29. package/dist/extensions/Blocks/Recommendation/utils/strategyCommit.js +24 -0
  30. package/dist/extensions/Blocks/Recommendation/validation/requiredFields.js +21 -12
  31. package/dist/guido.css +1 -1
  32. package/dist/services/templateLibraryApi.js +17 -14
  33. package/dist/src/components/organisms/onboarding/RecommendationStrategyOnboarding.vue.d.ts +2 -0
  34. package/dist/src/enums/extensions/recommendationBlock.d.ts +2 -0
  35. package/dist/src/extensions/Blocks/Items/enums/productEnums.d.ts +0 -3
  36. package/dist/src/extensions/Blocks/Items/template.d.ts +0 -19
  37. package/dist/src/extensions/Blocks/Recommendation/constants/defaultConfig.d.ts +1 -0
  38. package/dist/src/extensions/Blocks/Recommendation/constants/index.d.ts +1 -1
  39. package/dist/src/extensions/Blocks/Recommendation/controls/main/index.d.ts +2 -0
  40. package/dist/src/extensions/Blocks/Recommendation/controls/main/strategy.d.ts +9 -0
  41. package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.d.ts +7 -2
  42. package/dist/src/extensions/Blocks/Recommendation/store/recommendation.d.ts +79 -0
  43. package/dist/src/extensions/Blocks/Recommendation/utils/strategyCommit.d.ts +14 -0
  44. package/dist/src/extensions/Blocks/Recommendation/validation/requiredFields.d.ts +4 -0
  45. package/dist/src/stores/onboarding.d.ts +377 -0
  46. package/dist/src/utils/genericUtil.d.ts +6 -0
  47. package/dist/src/utils/liquidDynamicContent.d.ts +20 -0
  48. package/dist/static/styles/components/recommendation-strategy.css.js +34 -4
  49. package/dist/static/styles/components/skeleton.css.js +23 -0
  50. package/dist/stores/onboarding.js +41 -36
  51. package/dist/utils/genericUtil.js +63 -54
  52. package/dist/utils/liquidDynamicContent.js +15 -0
  53. package/dist/utils/pairProductVariables.js +71 -71
  54. package/dist/utils/templatePreparation.js +61 -60
  55. package/package.json +5 -5
  56. package/dist/extensions/Blocks/Items/constants/cardLayout.js +0 -20
  57. package/dist/src/extensions/Blocks/Items/constants/cardLayout.d.ts +0 -44
@@ -1,31 +1,32 @@
1
- import { useActionsApi as k } from "../composables/useActionsApi.js";
2
- import { useConfig as U } from "../composables/useConfig.js";
3
- import { useHtmlCompiler as x } from "../composables/useHtmlCompiler.js";
4
- import { DEFAULT_CURRENCY as m, DEFAULT_NODE_CONFIG as a } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
5
- import { useRecommendationExtensionStore as T } from "../extensions/Blocks/Recommendation/store/recommendation.js";
6
- import { mapLegacyStrategy as L } from "../extensions/Blocks/Recommendation/utils/legacyStrategyMap.js";
7
- import { DATA_ATTRIBUTES as C } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
8
- import { parsePageList as R } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
9
- import { useDynamicContentStore as N } from "../stores/dynamic-content.js";
10
- import { useEditorStore as z } from "../stores/editor.js";
1
+ import { useActionsApi as R } from "../composables/useActionsApi.js";
2
+ import { useConfig as k } from "../composables/useConfig.js";
3
+ import { useHtmlCompiler as N } from "../composables/useHtmlCompiler.js";
4
+ import { RRS_CONFIG_VERSION as U, DEFAULT_CURRENCY as m, DEFAULT_NODE_CONFIG as n } from "../extensions/Blocks/Recommendation/constants/defaultConfig.js";
5
+ import { useRecommendationExtensionStore as I } from "../extensions/Blocks/Recommendation/store/recommendation.js";
6
+ import { mapLegacyStrategy as x } from "../extensions/Blocks/Recommendation/utils/legacyStrategyMap.js";
7
+ import { DATA_ATTRIBUTES as A } from "../extensions/Blocks/Unsubscribe/utils/constants.js";
8
+ import { parsePageList as L } from "../extensions/Blocks/Unsubscribe/utils/utils.js";
9
+ import { useDynamicContentStore as z } from "../stores/dynamic-content.js";
10
+ import { useEditorStore as O } from "../stores/editor.js";
11
11
  import { useUnsubscribeStore as _ } from "../stores/unsubscribe.js";
12
- import { assignTrackingIds as v } from "./linkTrackingIds.js";
13
- function O(l) {
14
- const c = new DOMParser().parseFromString(l, "text/html").querySelectorAll(`[${C.PAGE_LIST}]`), t = [];
15
- return c.forEach((i) => {
16
- const o = i.getAttribute(C.PAGE_LIST);
17
- o && t.push(...R(o));
12
+ import { isPlainObject as v } from "./genericUtil.js";
13
+ import { assignTrackingIds as B } from "./linkTrackingIds.js";
14
+ function G(l) {
15
+ const i = new DOMParser().parseFromString(l, "text/html").querySelectorAll(`[${A.PAGE_LIST}]`), t = [];
16
+ return i.forEach((s) => {
17
+ const r = s.getAttribute(A.PAGE_LIST);
18
+ r && t.push(...L(r));
18
19
  }), [...new Set(t)];
19
20
  }
20
21
  async function M(l) {
21
- const n = new DOMParser().parseFromString(l, "text/html").querySelectorAll(".recommendation-block-v2");
22
- if (n.length === 0)
22
+ const a = new DOMParser().parseFromString(l, "text/html").querySelectorAll(".recommendation-block-v2");
23
+ if (a.length === 0)
23
24
  return;
24
- const c = T();
25
- n.forEach((t) => {
26
- var r, d, g, f, s, y;
27
- const i = t.getAttribute("recommendation-id"), o = i ? Number(i) : NaN;
28
- if (!Number.isFinite(o))
25
+ const i = I();
26
+ a.forEach((t) => {
27
+ var d, g, f, c, y, S;
28
+ const s = t.getAttribute("recommendation-id"), r = s ? Number(s) : NaN;
29
+ if (!Number.isFinite(r))
29
30
  return;
30
31
  const p = t.getAttribute("esd-ext-config");
31
32
  if (!p)
@@ -36,32 +37,32 @@ async function M(l) {
36
37
  } catch {
37
38
  return;
38
39
  }
39
- if (!e || typeof e != "object" || Array.isArray(e))
40
+ if (!v(e))
40
41
  return;
41
- const b = {
42
+ const C = !!e.strategyId || (e.configVersion ?? 0) >= U, o = {
42
43
  // Normalize legacy strategy keys (e.g. `mostViewed` → `mostPopular`) so
43
44
  // already-saved blocks that never re-run the migrator don't emit a
44
45
  // strategy-less campaign URL. `||` also catches '' / undefined (SD-144882).
45
- strategy: L(e.strategy) || a.strategy,
46
- strategyId: e.strategyId ?? a.strategyId,
47
- language: e.language ?? a.language,
48
- size: e.size ?? a.size,
46
+ strategy: x(e.strategy) || (C ? "" : n.strategy),
47
+ strategyId: e.strategyId ?? n.strategyId,
48
+ language: e.language ?? n.language,
49
+ size: e.size ?? n.size,
49
50
  // Spread the default arrays so each block gets a fresh reference
50
51
  // instead of sharing the singleton in DEFAULT_NODE_CONFIG.
51
- productIds: e.productIds ?? [...a.productIds],
52
- filters: e.filters ?? [...a.filters],
53
- shuffleProducts: e.shuffleProducts ?? a.shuffleProducts,
54
- currencyCode: ((r = e.currency) == null ? void 0 : r.code) ?? m.code,
55
- currencySymbol: ((d = e.currency) == null ? void 0 : d.symbol) ?? m.symbol,
56
- currencyAlignment: ((g = e.currency) == null ? void 0 : g.alignment) ?? m.alignment,
57
- currencyDecimalCount: ((f = e.currency) == null ? void 0 : f.decimalCount) ?? m.decimalCount,
58
- currencyDecimalSeparator: ((s = e.currency) == null ? void 0 : s.decimalSeparator) ?? m.decimalSeparator,
59
- currencyThousandSeparator: ((y = e.currency) == null ? void 0 : y.thousandSeparator) ?? m.thousandSeparator
52
+ productIds: e.productIds ?? [...n.productIds],
53
+ filters: e.filters ?? [...n.filters],
54
+ shuffleProducts: e.shuffleProducts ?? n.shuffleProducts,
55
+ currencyCode: ((d = e.currency) == null ? void 0 : d.code) ?? m.code,
56
+ currencySymbol: ((g = e.currency) == null ? void 0 : g.symbol) ?? m.symbol,
57
+ currencyAlignment: ((f = e.currency) == null ? void 0 : f.alignment) ?? m.alignment,
58
+ currencyDecimalCount: ((c = e.currency) == null ? void 0 : c.decimalCount) ?? m.decimalCount,
59
+ currencyDecimalSeparator: ((y = e.currency) == null ? void 0 : y.decimalSeparator) ?? m.decimalSeparator,
60
+ currencyThousandSeparator: ((S = e.currency) == null ? void 0 : S.thousandSeparator) ?? m.thousandSeparator
60
61
  };
61
- c.seedBlockUrlConfig(o, b);
62
+ i.seedBlockUrlConfig(r, o);
62
63
  });
63
64
  try {
64
- await c.fetchRecommendationCreateData();
65
+ await i.fetchRecommendationCreateData();
65
66
  } catch (t) {
66
67
  console.warn(
67
68
  "Recommendation reference data pre-load failed; validator will skip the availability check.",
@@ -69,34 +70,34 @@ async function M(l) {
69
70
  );
70
71
  }
71
72
  }
72
- const Z = () => {
73
- const l = N(), u = z(), n = _(), { getCompiledEmail: c, getTemplateData: t, updateHtmlAndCss: i } = k(), { compileHtml: o, compileAmpHtml: p } = x(), { isFeatureEnabled: e } = U();
73
+ const re = () => {
74
+ const l = z(), u = O(), a = _(), { getCompiledEmail: i, getTemplateData: t, updateHtmlAndCss: s } = R(), { compileHtml: r, compileAmpHtml: p } = N(), { isFeatureEnabled: e } = k();
74
75
  return {
75
76
  prepareTemplateDetails: async () => {
76
- let { html: r, css: d, syncModulesIds: g = [] } = await t();
77
+ let { html: o, css: d, syncModulesIds: g = [] } = await t();
77
78
  if (e("linkTrackingIds"))
78
79
  try {
79
- const { html: h, changed: F, nextSeq: H } = v(r, u.trackIdSessionFloor);
80
- u.trackIdSessionFloor = H, F && (r = h, await i(h, d));
81
- } catch (h) {
82
- console.error("Tracking-id step failed, saving anyway:", h);
80
+ const { html: b, changed: F, nextSeq: H } = B(o, u.trackIdSessionFloor);
81
+ u.trackIdSessionFloor = H, F && (o = b, await s(b, d));
82
+ } catch (b) {
83
+ console.error("Tracking-id step failed, saving anyway:", b);
83
84
  }
84
- const { html: f, ampHtml: s = "", ampErrors: y = [] } = await c({
85
+ const { html: f, ampHtml: c = "", ampErrors: y = [] } = await i({
85
86
  minimize: !0,
86
87
  resetDataSavedFlag: !1
87
88
  });
88
- n.selectedUnsubscribePages.length && await n.fetchTemplates(), await M(r);
89
- const { compiledHtml: I, stats: S, appliedRules: w } = o(f), D = s && p(s).compiledHtml, E = l.getSelectedDynamicContentList, P = T(), A = O(r);
89
+ a.selectedUnsubscribePages.length && await a.fetchTemplates(), await M(o);
90
+ const { compiledHtml: S, stats: h, appliedRules: w } = r(f), D = c && p(c).compiledHtml, E = l.getSelectedDynamicContentList, P = I(), T = G(o);
90
91
  return console.debug("HTML Compilation Stats:", {
91
- originalSize: S.originalSize,
92
- compiledSize: S.compiledSize,
93
- reduction: `${S.reductionPercentage.toFixed(2)}%`,
92
+ originalSize: h.originalSize,
93
+ compiledSize: h.compiledSize,
94
+ reduction: `${h.reductionPercentage.toFixed(2)}%`,
94
95
  appliedRules: w,
95
- executionTime: `${S.executionTime.toFixed(2)}ms`
96
+ executionTime: `${h.executionTime.toFixed(2)}ms`
96
97
  }), {
97
98
  dynamicContentList: E,
98
- compiledHtml: I,
99
- rawHtml: r,
99
+ compiledHtml: S,
100
+ rawHtml: o,
100
101
  css: d,
101
102
  ampHtml: D,
102
103
  ampErrors: y,
@@ -106,14 +107,14 @@ const Z = () => {
106
107
  configs: {}
107
108
  },
108
109
  unsubscribe: {
109
- status: A.length > 0,
110
- config: A
110
+ status: T.length > 0,
111
+ config: T
111
112
  }
112
113
  };
113
114
  }
114
115
  };
115
116
  };
116
117
  export {
117
- O as getHtmlReferencedUnsubscribePages,
118
- Z as useTemplatePreparation
118
+ G as getHtmlReferencedUnsubscribePages,
119
+ re as useTemplatePreparation
119
120
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useinsider/guido",
3
- "version": "3.18.2-beta.fc246a7",
3
+ "version": "3.18.2-beta.fc87f65",
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",
@@ -77,7 +77,7 @@
77
77
  "@typescript-eslint/parser": "7.18.0",
78
78
  "@useinsider/eslint-config": "1.5.3",
79
79
  "@vitejs/plugin-vue2": "2.3.1",
80
- "@vitest/coverage-v8": "2.1.9",
80
+ "@vitest/coverage-v8": "4.1.11",
81
81
  "eslint": "8.57.1",
82
82
  "eslint-config-airbnb-base": "15.0.0",
83
83
  "eslint-config-airbnb-typescript": "18.0.0",
@@ -90,17 +90,17 @@
90
90
  "happy-dom": "15.11.7",
91
91
  "husky": "9.1.7",
92
92
  "msw": "2.10.3",
93
- "nyc": "17.1.0",
93
+ "nyc": "18.0.0",
94
94
  "sass": "1.69.7",
95
95
  "typescript": "5.5.4",
96
96
  "typescript-eslint": "8.26.0",
97
97
  "vite-plugin-dts": "4.5.4",
98
98
  "vite-plugin-istanbul": "7.0.0",
99
- "vitest": "2.1.9",
99
+ "vitest": "4.1.11",
100
100
  "vue-tsc": "2.2.10"
101
101
  },
102
102
  "overrides": {
103
- "axios": "1.8.2",
103
+ "axios": "1.20.0",
104
104
  "flatted": "3.4.2",
105
105
  "micromatch": "4.0.8",
106
106
  "path-to-regexp": "6.3.0"
@@ -1,20 +0,0 @@
1
- import { SETTINGS_ENUMS as r } from "../enums/settingsEnums.js";
2
- const I = "130px", L = "100%", R = (e) => e === r.ORIENTATION.HORIZONTAL ? I : L, n = {
3
- VERTICAL: "es-p5b es-p5t",
4
- HORIZONTAL: "es-p5l es-p5r"
5
- }, o = "data-items-cell-pad", d = (e) => `${o}="${e ? "v" : "h"}"`, t = (e) => e ? ` ${n.VERTICAL}` : ` ${n.HORIZONTAL}`, E = (e, A) => {
6
- if (!e.includes(o))
7
- return e;
8
- const T = A ? n.HORIZONTAL : n.VERTICAL, s = A ? n.VERTICAL : n.HORIZONTAL, c = A ? "v" : "h";
9
- return e.includes(T) ? e.replace(T, s).replace(new RegExp(`${o}="[hv]"`), `${o}="${c}"`) : e;
10
- };
11
- export {
12
- n as BLOCK_CELL_PADDING,
13
- o as BLOCK_CELL_PAD_ATTR,
14
- I as NAME_HORIZONTAL_MAX_WIDTH,
15
- L as NAME_VERTICAL_MAX_WIDTH,
16
- d as blockCellPadMarker,
17
- t as blockCellPaddingFor,
18
- R as nameMaxWidthFor,
19
- E as reorientBlockCellPadding
20
- };
@@ -1,44 +0,0 @@
1
- /**
2
- * Single owner for the Items card orientation-dependent layout contract (SD-149368).
3
- *
4
- * Two things depend on a card's orientation and are written across several layers:
5
- *
6
- * 1. Name column width — a horizontal card lays the name in a narrow side-by-side
7
- * column, so it is capped; a vertical card gives it a full-width row.
8
- * 2. Block-cell padding — the collapsible price / original-price block-cell carries its
9
- * own inter-cell spacing (horizontal cards pad left/right, vertical cards pad
10
- * top/bottom) so a hidden element removes its own spacing instead of leaving a gap.
11
- *
12
- * Every layer that writes these — template render, layouts/horizontal.html,
13
- * NameTrimmingControl (trimming toggle) and settingsControl (orientation change) — MUST
14
- * derive them here, or a migrated / re-toggled card silently drifts out of sync with
15
- * freshly generated markup (convention B1: cross-layer literals live in one module).
16
- */
17
- export declare const NAME_HORIZONTAL_MAX_WIDTH = "130px";
18
- export declare const NAME_VERTICAL_MAX_WIDTH = "100%";
19
- /** Name max-width for a card orientation. Non-horizontal (incl. undefined) → full width. */
20
- export declare const nameMaxWidthFor: (orientation?: string) => string;
21
- /** Orientation-dependent inter-cell padding classes for a collapsible block-cell. */
22
- export declare const BLOCK_CELL_PADDING: {
23
- readonly VERTICAL: "es-p5b es-p5t";
24
- readonly HORIZONTAL: "es-p5l es-p5r";
25
- };
26
- /**
27
- * Attribute the block-cell carries to mark its LAYOUT-owned padding orientation ('v'|'h').
28
- * The orientation toggle keys off this marker so it only ever rewrites the padding the
29
- * layout itself baked — a user's own es-p* padding classes are never matched or clobbered
30
- * (SD-149368 F1), and a cell without the marker is left untouched rather than mis-swapped.
31
- */
32
- export declare const BLOCK_CELL_PAD_ATTR = "data-items-cell-pad";
33
- /** Marker attribute (`data-items-cell-pad="v|h"`) for a block-cell in the given orientation. */
34
- export declare const blockCellPadMarker: (isVertical: boolean) => string;
35
- /** Padding classes (leading space included) for a block-cell in the given orientation. */
36
- export declare const blockCellPaddingFor: (isVertical: boolean) => string;
37
- /**
38
- * Rewrites a block-cell's LAYOUT-owned padding classes to the target orientation, keyed off
39
- * the BLOCK_CELL_PAD_ATTR marker. The orientation-change rebuild re-injects existing cells
40
- * via getOuterHTML(), which still carry the previous orientation's padding — swap only the
41
- * layout pair (and flip the marker) so price/original-price cells stay padded after a toggle
42
- * (SD-149368 F3), while a user's own padding and any unmarked cell are left alone (F1).
43
- */
44
- export declare const reorientBlockCellPadding: (html: string, toVertical: boolean) => string;