@useinsider/guido 3.2.0-beta.da93bda → 3.2.0-beta.dc55d68

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 (61) hide show
  1. package/dist/@types/config/schemas.js +150 -94
  2. package/dist/components/Guido.vue.js +1 -1
  3. package/dist/components/Guido.vue2.js +88 -87
  4. package/dist/composables/useRecommendation.js +16 -12
  5. package/dist/config/compiler/unsubscribeCompilerRules.js +40 -37
  6. package/dist/config/migrator/index.js +9 -9
  7. package/dist/config/migrator/recommendation/compositionMapper.js +98 -0
  8. package/dist/config/migrator/recommendation/extractors.js +27 -0
  9. package/dist/config/migrator/recommendation/htmlBuilder.js +496 -0
  10. package/dist/config/migrator/recommendation/parseLegacyConfig.js +33 -0
  11. package/dist/config/migrator/recommendation/settingsMapper.js +78 -0
  12. package/dist/config/migrator/recommendation/themeMapper.js +93 -0
  13. package/dist/config/migrator/recommendationMigrator.js +74 -290
  14. package/dist/enums/extensions/recommendationBlock.js +2 -1
  15. package/dist/enums/unsubscribe.js +34 -27
  16. package/dist/extensions/Blocks/Recommendation/block.js +35 -32
  17. package/dist/extensions/Blocks/Recommendation/constants/defaultConfig.js +5 -5
  18. package/dist/extensions/Blocks/Recommendation/controls/main/utils.js +228 -181
  19. package/dist/extensions/Blocks/Recommendation/services/configService.js +65 -29
  20. package/dist/extensions/Blocks/Recommendation/store/recommendation.js +21 -19
  21. package/dist/extensions/Blocks/Recommendation/templates/grid/template.js +8 -8
  22. package/dist/extensions/Blocks/Recommendation/templates/utils.js +1 -1
  23. package/dist/extensions/Blocks/Recommendation/utils/preserveTextStyles.js +13 -22
  24. package/dist/guido.css +1 -1
  25. package/dist/node_modules/@stripoinc/ui-editor-extensions/dist/esm/index.js +258 -235
  26. package/dist/node_modules/valibot/dist/index.js +450 -235
  27. package/dist/package.json.js +1 -1
  28. package/dist/src/@types/config/defaults.d.ts +5 -1
  29. package/dist/src/@types/config/index.d.ts +3 -3
  30. package/dist/src/@types/config/schemas.d.ts +213 -0
  31. package/dist/src/@types/config/types.d.ts +9 -1
  32. package/dist/src/components/wrappers/WpModal.vue.d.ts +1 -1
  33. package/dist/src/composables/useConfig.d.ts +56 -0
  34. package/dist/src/composables/useRecommendation.test.d.ts +1 -0
  35. package/dist/src/config/migrator/index.d.ts +2 -1
  36. package/dist/src/config/migrator/recommendation/compositionMapper.d.ts +2 -0
  37. package/dist/src/config/migrator/recommendation/compositionMapper.test.d.ts +1 -0
  38. package/dist/src/config/migrator/recommendation/extractors.d.ts +7 -0
  39. package/dist/src/config/migrator/recommendation/extractors.test.d.ts +1 -0
  40. package/dist/src/config/migrator/recommendation/htmlBuilder.d.ts +11 -0
  41. package/dist/src/config/migrator/recommendation/parseLegacyConfig.d.ts +15 -0
  42. package/dist/src/config/migrator/recommendation/parseLegacyConfig.test.d.ts +1 -0
  43. package/dist/src/config/migrator/recommendation/settingsMapper.d.ts +7 -0
  44. package/dist/src/config/migrator/recommendation/settingsMapper.test.d.ts +1 -0
  45. package/dist/src/config/migrator/recommendation/themeMapper.d.ts +5 -0
  46. package/dist/src/config/migrator/recommendation/themeMapper.test.d.ts +1 -0
  47. package/dist/src/config/migrator/recommendation/types.d.ts +205 -0
  48. package/dist/src/config/migrator/recommendationMigrator.d.ts +13 -1
  49. package/dist/src/config/migrator/recommendationMigrator.test.d.ts +1 -0
  50. package/dist/src/enums/unsubscribe.d.ts +5 -0
  51. package/dist/src/extensions/Blocks/Recommendation/controls/main/utils.test.d.ts +1 -0
  52. package/dist/src/extensions/Blocks/Recommendation/services/configService.d.ts +10 -0
  53. package/dist/src/extensions/Blocks/Recommendation/services/configService.test.d.ts +1 -0
  54. package/dist/src/extensions/Blocks/Recommendation/types/nodeConfig.d.ts +1 -1
  55. package/dist/src/extensions/Blocks/Recommendation/utils/preserveTextStyles.d.ts +0 -3
  56. package/dist/src/stores/config.d.ts +504 -0
  57. package/dist/src/utils/htmlEscape.d.ts +5 -0
  58. package/dist/src/utils/htmlEscape.test.d.ts +1 -0
  59. package/dist/utils/htmlEscape.js +13 -0
  60. package/package.json +7 -3
  61. package/dist/extensions/Blocks/Recommendation/templates/grid/migration.js +0 -251
@@ -0,0 +1,205 @@
1
+ /**
2
+ * Internal types for the legacy Recommendation block migrator.
3
+ *
4
+ * The legacy block stores its full state as a JSON blob inside the
5
+ * `esd-dev-product-config` HTML attribute. These interfaces describe
6
+ * the subset of that schema we depend on. All fields are optional —
7
+ * legacy data is heterogeneous and we use defensive optional chaining
8
+ * everywhere downstream.
9
+ */
10
+ /** Per-side numeric values used by border / padding theme fields. */
11
+ export interface LegacySides<T = number> {
12
+ left?: T;
13
+ right?: T;
14
+ top?: T;
15
+ bottom?: T;
16
+ }
17
+ /** Padding shape used for both desktop and mobile in legacy theme. */
18
+ export interface LegacyPaddingViewport {
19
+ all?: number;
20
+ top?: number;
21
+ right?: number;
22
+ bottom?: number;
23
+ left?: number;
24
+ }
25
+ /** Padding object covering both desktop and mobile breakpoints. */
26
+ export interface LegacyPadding {
27
+ desktop?: LegacyPaddingViewport;
28
+ mobile?: LegacyPaddingViewport;
29
+ }
30
+ /** Border-radius shape — observed in two flavours: shorthand or per-corner. */
31
+ export interface LegacyBorderRadius {
32
+ /** Single shorthand value (e.g. `radius: 4`). */
33
+ radius?: number;
34
+ /** Per-corner: top-left / top-right / bottom-right / bottom-left (in px). */
35
+ lt?: number;
36
+ rt?: number;
37
+ rb?: number;
38
+ lb?: number;
39
+ }
40
+ /** Theme attached to text-like variables (name, prices, omnibus, custom-attr). */
41
+ export interface LegacyTextTheme {
42
+ textStyle?: {
43
+ 'font-family'?: string;
44
+ 'font-size'?: string;
45
+ 'font-weight'?: string;
46
+ 'font-style'?: string;
47
+ };
48
+ textColor?: {
49
+ color?: string;
50
+ };
51
+ textBackgroundColor?: {
52
+ color?: string;
53
+ };
54
+ textPadding?: LegacyPadding;
55
+ textLineSpacing?: {
56
+ lineSpacing?: string;
57
+ 'font-lineSpacing'?: string;
58
+ };
59
+ textAlign?: {
60
+ align?: string;
61
+ };
62
+ textTrimming?: boolean;
63
+ }
64
+ /** Theme attached to image variables. */
65
+ export interface LegacyImageTheme {
66
+ imageSize?: {
67
+ width?: number;
68
+ height?: number;
69
+ };
70
+ }
71
+ /** Theme attached to the button variable. */
72
+ export interface LegacyButtonTheme {
73
+ buttonStyle?: {
74
+ 'font-family'?: string;
75
+ 'font-size'?: string;
76
+ 'font-weight'?: string;
77
+ 'font-style'?: string;
78
+ };
79
+ buttonStretch?: {
80
+ stretched?: boolean;
81
+ };
82
+ buttonInternalPadding?: LegacyPadding;
83
+ buttonExternalPadding?: LegacyPadding;
84
+ buttonText?: {
85
+ text?: string;
86
+ };
87
+ buttonColor?: {
88
+ color?: string;
89
+ };
90
+ textButtonColor?: {
91
+ color?: string;
92
+ };
93
+ buttonBorder?: {
94
+ width?: LegacySides<number>;
95
+ style?: LegacySides<string>;
96
+ color?: LegacySides<string>;
97
+ };
98
+ buttonBorderRadius?: LegacyBorderRadius;
99
+ buttonAlign?: {
100
+ align?: string;
101
+ };
102
+ }
103
+ /** Block-level theme. */
104
+ export interface LegacyBlockTheme {
105
+ blockAdapt?: {
106
+ adapt?: boolean;
107
+ };
108
+ blockPadding?: LegacyPadding;
109
+ }
110
+ /** Single composition.variable entry from `esd-dev-product-config`. */
111
+ export interface LegacyVariable {
112
+ /** e.g. `p_name`, `p_button`, `p_attribute_<ts>`. */
113
+ variable?: string;
114
+ /** Marker that distinguishes custom product attributes (`'p_attribute'`). */
115
+ variableType?: string;
116
+ /** Selector legacy used to address this element in the HTML. */
117
+ visibilityAreaSelector?: string;
118
+ /** Custom-attribute value (e.g. `product_attribute.brand`). */
119
+ value?: string;
120
+ /** Whether the element is hidden in the legacy block. */
121
+ hidden?: boolean;
122
+ /** Sort order across composition entries (lower = earlier). */
123
+ positionIdx?: number;
124
+ /** Element-kind-specific theme bag. */
125
+ theme?: LegacyTextTheme & LegacyImageTheme & LegacyButtonTheme;
126
+ /** Custom attribute marker. */
127
+ custom?: boolean;
128
+ }
129
+ /** Full decoded `esd-dev-product-config` shape. */
130
+ export interface LegacyProductConfig {
131
+ rowCount?: number;
132
+ totalCount?: number;
133
+ orientation?: string;
134
+ composition?: {
135
+ variables?: LegacyVariable[];
136
+ };
137
+ theme?: LegacyBlockTheme;
138
+ }
139
+ /** Element kind dispatched from a legacy `variable` value. */
140
+ export type ElementKind = 'image' | 'text' | 'button' | 'custom' | 'title';
141
+ /** Mapping output from a single legacy variable. */
142
+ export interface MappedVariable {
143
+ /** Composition key (`productName`, `customAttr:brand`, …) or `__title__` for titles. */
144
+ key: string;
145
+ kind: ElementKind;
146
+ hidden: boolean;
147
+ positionIdx: number;
148
+ /** Original legacy variable (kept for downstream theme mapping). */
149
+ legacy: LegacyVariable;
150
+ /** For custom attrs: bare attribute name (e.g. `brand`). */
151
+ customAttrName?: string;
152
+ /** For custom attrs: full `product-attr` value (e.g. `product_attribute.brand`). */
153
+ customAttrValue?: string;
154
+ }
155
+ /** CSS style strings + attributes resolved from a single text-like theme. */
156
+ export interface MappedTextStyle {
157
+ /** Inline CSS for outer `<td>` (background, padding). */
158
+ tdStyle: string;
159
+ /** Inline CSS for inner `<p>` (typography, color, line-height, text-align). */
160
+ pStyle: string;
161
+ /** Value for `<td align>` attribute, if any. */
162
+ align?: string;
163
+ /** Whether to wrap content in `<strong>`. */
164
+ wrapBold: boolean;
165
+ /** Whether to wrap content in `<em>`. */
166
+ wrapItalic: boolean;
167
+ /** True if `textTrimming: true` in theme. */
168
+ textTrimming: boolean;
169
+ }
170
+ /** Resolved button styles. */
171
+ export interface MappedButtonStyle {
172
+ /** Inline CSS for outer `<td>` (external padding). */
173
+ tdStyle: string;
174
+ /** Value for `<td align>`, if any. */
175
+ align?: string;
176
+ /** Inline CSS for `<span class="es-button-border">`. */
177
+ spanStyle: string;
178
+ /** Inline CSS for `<a class="es-button">`. */
179
+ aStyle: string;
180
+ /** Button label text. */
181
+ text?: string;
182
+ }
183
+ /** Resolved image styles. */
184
+ export interface MappedImageStyle {
185
+ /** Width in pixels (number form) — applied as both `width=` attr and CSS. */
186
+ width?: number;
187
+ /** Height in pixels. */
188
+ height?: number;
189
+ }
190
+ /** Per-variable mapped style bag, keyed by composition key. */
191
+ export type PerElementStyles = Record<string, MappedTextStyle | MappedButtonStyle | MappedImageStyle | undefined>;
192
+ /** Composition mapper output. */
193
+ export interface MappedComposition {
194
+ composition: string[];
195
+ visibility: Record<string, boolean>;
196
+ customAttributes: string[];
197
+ /** Mapping of customAttr key → full `product-attr` value. */
198
+ customAttrValues: Record<string, string>;
199
+ /** Title variable, if present (for separate title rendering). */
200
+ titleVariable?: LegacyVariable;
201
+ /** Resolved styles per composition key. */
202
+ perElementStyles: PerElementStyles;
203
+ /** Whether *any* element had `textTrimming: true`. */
204
+ anyTextTrimming: boolean;
205
+ }
@@ -1 +1,13 @@
1
- export declare function migrateRecommendation(html: string): string;
1
+ /**
2
+ * Idempotent: the selector matches only blocks that have
3
+ * `esd-dev-product-config` AND lack `recommendation-block-v2`, so
4
+ * re-running on a migrated template is a no-op.
5
+ */
6
+ import type { LegacyRecommendationConfig } from '@@/Types/config';
7
+ /**
8
+ * Migrate all legacy Recommendation Blocks in the given HTML string.
9
+ * @param html - Full template HTML.
10
+ * @param recommendationConfigs - Map of campaign-id → legacy config (`Record<string, LegacyRecommendationConfig>`).
11
+ * @returns Migrated HTML, or the original HTML if no legacy blocks exist.
12
+ */
13
+ export declare function migrateRecommendation(html: string, recommendationConfigs?: Record<string, LegacyRecommendationConfig>): string;
@@ -12,6 +12,11 @@ export declare const URLS: {
12
12
  UNSUBSCRIBE_URL: string;
13
13
  PREFERENCES_URL: string;
14
14
  };
15
+ export declare const PRODUCT_TYPE_URL_SEGMENTS: {
16
+ readonly 60: "email";
17
+ readonly 49: "journey";
18
+ readonly 97: "email";
19
+ };
15
20
  export declare const INSIDER_ID = "iid";
16
21
  export declare const DEFAULT_UNSUBSCRIBE_GROUP: {
17
22
  readonly name: "Global Unsubscribe";
@@ -119,6 +119,16 @@ export declare class RecommendationConfigService {
119
119
  *
120
120
  * Reads existing data-attributes and creates a proper node config.
121
121
  * Used when loading templates created before node config was implemented.
122
+ *
123
+ * Sources, in priority order (later overrides earlier):
124
+ * 1. `esd-ext-config` JSON blob — emitted by the recommendation migrator and
125
+ * by hand-authored new templates. Carries the full RecommendationNodeConfig
126
+ * (strategy, language, currency, filters, productIds, etc.) which the
127
+ * discrete data-* attrs below cannot capture.
128
+ * 2. Discrete `data-*` attributes — runtime source of truth for
129
+ * layout/composition/spacing; controls keep these in sync as the user
130
+ * edits, so we let them override the JSON blob if they disagree.
131
+ * 3. `currency-*` attributes — durable currency source on the block element.
122
132
  * @param api - Stripo extension API with document modifier
123
133
  * @param node - The block node to migrate
124
134
  * @returns The migrated configuration
@@ -24,7 +24,7 @@ export interface CurrencyConfig {
24
24
  /** Number of decimal places (-1 for no formatting) */
25
25
  decimalCount: number;
26
26
  /** Character used for decimal separation */
27
- decimalSeparator: '.' | ',';
27
+ decimalSeparator: '.' | ',' | ' ';
28
28
  /** Character used for thousands separation */
29
29
  thousandSeparator: '.' | ',' | ' ' | '';
30
30
  }
@@ -1,6 +1,3 @@
1
- /**
2
- * Utility for preserving text styling when updating innerHTML
3
- */
4
1
  import type { ImmutableHtmlNode } from '@stripoinc/ui-editor-extensions';
5
2
  /**
6
3
  * Preserves existing style tags when updating text content